$.cancelEvent = function (e) {//阻止事件冒泡    if (e.stopPropagation) e.stopPropagation();    else e.cancelBubble = true;    if (e.preventDefault) e.preventDefault();    else e.returnValue = false;};(function ($) {//jquery+flash顯示圖片實時加載進度插件    $.fn.design = function (cfg) {//配置參數 swfID：flash的容器ID,swfUrl：flash文件地址, step：鼠標滾輪滾動一次圖片放大縮小的數值，imgLoading:如果無法獲取到swf容器時等待圖片地址，圖片大小16x16        function swfContainer() {//獲取SWF容器，注意不能返回swf注冊的回調函數，要不Firefox會出錯            var c = window[cfg.swfID] || document[cfg.swfID] || $('#' + cfg.swfID).get(0);            if (c && c.forJS) return c; return false;        }        function ajust(e) {//鼠標滾輪事件，往下滾動放大，否則縮小，注意IE和w3c瀏覽器相反            e = e || window.event; $.cancelEvent(e);            var op = (_ie ? -e.wheelDelta : e.detail) > 0 ? "+=" : "-=", p = { width: op + cfg.step + "px", height: op + Math.ceil(_img.height() * cfg.step / _img.width()) + "px" };            if(_img.width()<=300&&op=='-=')return false;//限制圖片最小為300px            _img.stop(true).animate(p, 100); resizelightbox();        }        function mousewheel(bind) {//綁定鼠標滾動事件            if (bind) _ie ? _img.get(0).onmousewheel = ajust : _img.bind('DOMMouseScroll', ajust);            else _ie ? _img.get(0).onmousewheel = null : _img.unbind('DOMMouseScroll', ajust);             $(window)[bind ? 'bind' : 'unbind']('resize', resizelightbox);//如果窗體大小改變也重置lightbox大小        }        function show(_show) {//顯示或者隱藏lightbox和內容層            if (_ie6) $('select').css('visibility', _show ? 'hidden' : 'visible');            if (_show) {//顯示                _info.html('正在下載...');                _pro.css('width', '1%');                if (!_container) _info.css('background', 'url('+cfg.imgLoading+') no-repeat 100px 7px');//如果無法獲取到swf容器，則顯示等待圖片                _pop.show();                Resize(true);            }            else {//隱藏                _pop.hide();                mousewheel(false);//注銷鼠標滾動事件                toolbar();//隱藏操作欄                _pro.parent().show();                _img.get(0).style.cssText = '';//去掉鼠標滾動時加上的內聯樣式            }            _lightbox[_show ? 'show' : 'hide']();        }        function resizelightbox() {//設置lightbox的大小            _lightbox.css({ width: $(document).width(), height: $(document).height() });        }        function Resize(loading) {//設置內容層的位置            var wh = $(window).height(), ww = $(window).width(), pw = _pop.outerWidth(), ph = _pop.outerHeight()                     , p = { left: 0, top: 0 }, scrolltop = $(document).scrollTop();            if (pw < ww) p.left = (ww - pw) / 2;            if (ph < wh) p.top = (wh - ph) / 2 + (_ie6 ? scrolltop : 0);            if (loading) _pop.css({ top: p.top, left: p.left });//圖片加載等待            else {//圖片加載完畢顯示                mousewheel(true);//添加鼠標滾動事件                if (p.left > 0 || p.top > 0) _pop.animate(p, 500);//動畫形式移動內容層居中            }            resizelightbox();        }        function toolbar(show, onlyClose) {//顯示和隱藏操作欄            if (show) {                if (onlyClose) _toolbar.children().hide().eq(2).show();                else _toolbar.children().show(); _toolbar.show();            } else _toolbar.hide();        }        $.fn.design.loading = function (p, loaded, total) {//flash中加載圖片過程需要調用的js方法            _pro.css('width', p + '%');            _info.html("已下載：" + Math.ceil(loaded / 1024, 1) + "kb，總共" + Math.ceil(total / 1024, 1) + "kb，完成" + p + '%');        };        $.fn.design.success = function (picurl, w, h) {//flash中加載圖片完成后需要調用的js方法            _pro.parent().hide();            toolbar(true);//顯示操作欄            _as.eq(0).attr('href', picurl);//設置原始圖片的鏈接            _pop.css({ top: _ie6 ? $(document).scrollTop() : 0, left: 0 });//將內容層置于左上角            _img.attr('src', picurl).fadeIn(500,function(){Resize();}); //500ms后fadeIn效果顯示圖片，然后調用Resize方法重置內容層的位置        };        $.fn.design.failure = function (msg) {//flash或者Image對象圖片出錯時需要調用的js方法            _info.html('<font color="red">' + msg + '</font>　');            if (!_container) _info.css('background', 'none'); toolbar(true, true);        };        var _lightbox, _pop, _toolbar, _as, _img, _tmpImg, _imgSrc='', _pro, _info, _container = null, _ie, _ie6, me = this;        function InitGUI() {//初始化加載圖片等待和顯示層的GUI            if (!cfg) cfg = {};            if (!cfg.swfID) cfg.swfID = 'swfId';            if (!cfg.swfUrl) cfg.swfUrl = '/images/loadSwf.swf';            if(!cfg.imgLoading)cfg.imgLoading='/images/loading.gif';            if (!/^/d+$/.test(cfg.step)) cfg.step = 100;            _lightbox = $('<div class="lightbox"></div>').appendTo(document.body);//增加lightbox DOM對象            _pop = $('<div class="popdesign"><p>'                    + '<a target="_blank" title="在新窗口中打開" href="#"></a>'                    + '<a title="實際大小" href="#" class="just"></a>'                    + '<a href="#" title="關閉" class="close"></a>'                    + '<span>鼠標滾動縮放圖片，按下左鍵拖動</span></p>'                    + '<img src="javascript:void(0)"/>'                    + '<div class="loading"><div class="pro"></div><div class="info"></div></div></div>').appendTo(document.body);//增加內容層DOM對象            _toolbar = _pop.find('p');//操作欄             _as = _toolbar.find('a'); //操作欄里面的對象            _img = _pop.find('img'); //圖片顯示容器對象            _pro = _pop.find('div.pro'); //圖片加載進度條對象            _info = _pop.find('div.info'); //圖片加載信息提示對象                        _ie = !!document.all; //是否為IE瀏覽器            _ie6 = _ie && /msie [5|6]/i.test(navigator.userAgent);//是否為IE6瀏覽器            _as.eq(1).click(function () { _img.get(0).style.cssText = ''; _img.css('display', 'block'); return false; });//顯示原始圖片大小            _as.eq(2).click(function () { show(); return false; });//關閉事件            _tmpImg = new Image(); //無法獲取到swf容器對象時使用Image對象加載            _tmpImg.onload = function () { $.fn.design.success(this.src); };//Image對象加載完成事件            _tmpImg.onerror = function () { $.fn.design.failure('文件加載失?。?#39;); };//Image對象加載圖片失敗事件            if (_ie6) $.Drag.Resize = resizelightbox;//如果為IE6注冊層拖動結束事件的Resize回調方法，以便修改lightbox大小            else _pop.addClass('fixed');//如果瀏覽器支持fixed屬性則增加fixed樣式            new $.Drag([_img, _pop]);//添加層拖動事件            //增加flash對象，注意swf添加方式            $('<div class="dvswf"></div>').appendTo(document.body).get(0).innerHTML = _ie ? '<object id="' + cfg.swfID + '" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"><param name="src" value="' + cfg.swfUrl + '"></object>' : '<embed id="' + cfg.swfID + '" type="application/x-shockwave-flash" src="' + cfg.swfUrl + '"/>';            //綁定事件            me.bind('click', function () {                if (_container === null) _container = swfContainer();//獲取swf容器                show(true);//顯示GUI                _imgSrc = this.src.replace('_s', '');//獲取實際的圖片地址路徑，注意本實例小圖和大圖的文件名相差為是否多“_s”，所以你的大圖和小圖的名稱對應關系不同時，請修改這里                 if (_container) _container.forJS(_imgSrc, '$.fn.design.loading', '$.fn.design.success', '$.fn.design.failure');//調用swf容器注冊的回調                else _tmpImg.src = _imgSrc;//獲取不到swf容器則使用Image對象加載大圖片                return false;            });        }        //docment加載完畢后初始化加載圖片等待和顯示層的GUI        if (document.readyState == 'complete') InitGUI();//docment對象已經加載完畢        else $(function () { InitGUI(); });//docment對象未加載完畢時則添加ready事件    }})(jQuery);