求个jquery封装，加载动画始终居中显示，代码已有，不会封装

Question

本帖最后由 mafeifan 于 2013-06-07 12:23:55 编辑

Answer 1

$.fn.extend({
    shows: function() {
        var wnd = $(window), doc = $(document);
        var left = doc.scrollLeft();
        var top = doc.scrollTop();        left += (wnd.width() - $('#indicator').width())/2;
        top += (wnd.height() - $('#indicator').height())/2;
        $(this).css("position","absolute");
        $(this).css("top",top);
        $(this).css("left",left);     
        $(this).show();        return this;
    }
});调用：
$('#indicator').shows();

Answer 2

$.fn.extend({
    shows: function() {
        var wnd = $(window), doc = $(document);
        var left = doc.scrollLeft();
        var top = doc.scrollTop();
 
        left += (wnd.width() - $('#indicator').width())/2;
        top += (wnd.height() - $('#indicator').height())/2;
        $(this).css("position","absolute");
        $(this).css("top",top);
        $(this).css("left",left);     
        $(this).show();
 
        return this;
    },
    hides: function() {
        var wnd = $(window), doc = $(document);
        var left = doc.scrollLeft();
        var top = doc.scrollTop();
 
        left += (wnd.width() - $('#indicator').width())/2;
        top += (wnd.height() - $('#indicator').height())/2;
        $(this).css("position","absolute");
        $(this).css("top",top);
        $(this).css("left",left);     
        $(this).hide();
 
        return this;
    }
});
 
调用：
$('#indicator').shows().hides();

Answer 3

$.fn.extend({
    shows: function() {
        var wnd = $(window), doc = $(document);
        var left = doc.scrollLeft();
        var top = doc.scrollTop();
  
        left += (wnd.width() - $(this).width())/2;
        top += (wnd.height() - $(this).height())/2;
        $(this).css("position","absolute");
        $(this).css("top",top);
        $(this).css("left",left);     
        $(this).show();
  
        return this;
    },
    hides: function() {
        var wnd = $(window), doc = $(document);
        var left = doc.scrollLeft();
        var top = doc.scrollTop();
  
        left += (wnd.width() - $(this).width())/2;
        top += (wnd.height() - $(this).height())/2;
        $(this).css("position","absolute");
        $(this).css("top",top);
        $(this).css("left",left);     
        $(this).hide();
  
        return this;
    }
});
  
调用：
$('#indicator').shows().hides();这个正确

Answer 4

请问$.fn.extend({}); 这段代码放在什么位置

Answer 5

单一个js文件也行，放head里也行调用加个$(function() {});