jquery------提供灵活的方法参数

index.jsp

<h1 >再次重逢的世界</h1>

 

my.js

$(document).ready(function(){
    (function($){
        $.fn.shadow=function(opt){
            /*var defaults={
                    copies:15,
                    opacity:0.1,
                    colors:"blue",
                    copyOffset:function(index){
                        return {x:index,y:index};
                    },
            };*/
            
            var option=$.extend({},$.fn.shadow.defaults,opt);
            
            return this.each(function(){
                var $original=$(this);
                for(var i=0;i<option.copies;i++){
                    var offset=option.copyOffset(i);
                    $original
                        .clone()  //复制元素
                        .css({
                            position:"absolute",
                            left:$original.offset().left+offset.x,
                            top:$original.offset().top+i+offset.y,
                            color:option.colors,
                            margin:0,
                            padding:0,
                            zIndex:-1,
                            opacity:option.opacity})
                        .appendTo("body");
                }
            });
        };
        
        $.fn.shadow.defaults={
                copies:15,
                opacity:0.1,
                colors:"red",
                copyOffset:function(index){
                    return {x:index,y:index};
                },
        };
    })(jQuery);
    
    
    $.fn.shadow.defaults.copies=10;
    $("h1").shadow({
        //copies:15,
        opacity:0.1,
        copyOffset:function(index){
            return {x:-index,y:-2*index};
        },
        colors:"blue",
    });

});

 

posted @ 2016-05-22 16:56  玉天恒  阅读(173)  评论(0编辑  收藏  举报