Create a Basic Plugin jQuery


plug.js

(function ( $ ) {
     $.fn.greenify = function( options ) {
         // This is the easiest way to have default options.
        var settings = $.extend({
            // These are the defaults.
            color: "#556b2f",
            backgroundColor: "white"
        }, options );
         // Greenify the collection based on the settings variable.
        return this.css({
            color: settings.color,
            backgroundColor: settings.backgroundColor
        });
     };
 }(jQuery));

demoplug.html

<!DOCTYPE html>
<html>
<head>
<title>This PlugIn</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script type="text/javascript" src="plug.js"></script>
</head>
<body>
<h2>Ram Pukar</h2>
<script type="text/javascript">
$(document).ready(function() {
$( "h2" ).greenify({
color: "blue",
backgroundColor:'orange'
});
});
</script>
</body>
</html>

Demo


Share on Google Plus

About Ram Pukar

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment

0 comments:

Post a Comment