JQuery - Plugins: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
(Der Seiteninhalt wurde durch einen anderen Text ersetzt: „Siehe: JavaScript - Plugins“)
 
Zeile 1: Zeile 1:
 
Siehe: [[JavaScript - Plugins]]
 
Siehe: [[JavaScript - Plugins]]
 +
 +
== Aufbau ==
 +
<pre>
 +
  //this is a jquery plugin,
 +
//jquery plugins start this way
 +
//so you could select $('img').imageCrop();
 +
$.fn.imageCrop = function(customOptions) {
 +
    //Iterate over each object
 +
    this.each(function() {
 +
        //keeps the current iterated object in a variable
 +
        //current image will be kept in this var untill the next loop
 +
        var currentObject = this,
 +
        //creates a new Image object   
 +
        image = new Image();
 +
        // And attach imageCrop when the object is loaded
 +
        //correct
 +
        image.onload = function() {
 +
            $.imageCrop(currentObject, customOptions);
 +
        };
 +
        //sets the src to wait for the onload event up here ^
 +
        image.src = currentObject.src;
 +
    });
 +
    // Unless the plug-in is returning an intrinsic value, always have the
 +
    // function return the 'this' keyword to maintain chainability
 +
    return this;
 +
};
 +
</pre>

Aktuelle Version vom 19. März 2019, 15:36 Uhr

Siehe: JavaScript - Plugins

Aufbau[Bearbeiten]

   //this is a jquery plugin,
//jquery plugins start this way 
//so you could select $('img').imageCrop();
$.fn.imageCrop = function(customOptions) {
    //Iterate over each object
    this.each(function() {
        //keeps the current iterated object in a variable
        //current image will be kept in this var untill the next loop
        var currentObject = this,
        //creates a new Image object    
        image = new Image();
        // And attach imageCrop when the object is loaded
        //correct
        image.onload = function() {
            $.imageCrop(currentObject, customOptions);
        };
        //sets the src to wait for the onload event up here ^
        image.src = currentObject.src;
    });
    // Unless the plug-in is returning an intrinsic value, always have the
    // function return the 'this' keyword to maintain chainability
    return this;
};