/*! * FileName : dww3.js * WebSite : http://duowan.com * Desc : * $Author: johnny $ * $Revision: 600 $ * $Date: 2012-10-12 11:12:41 +0800 (Fri, 12 Oct 2012) $ * */ (function($){ $.fn.Switchable = function(options) { var opts = $.extend( {}, $.fn.Switchable.Default, options ); var targetLi = $("." + opts.nav + " > li", $(this)), clickNext = $("." + opts.btnNext, $(this)), clickPrev = $("." + opts.btnPrev, $(this)), contentBox = $("." + opts.content, $(this)); var index = 1, contentBoxNum = contentBox.children().size(), slideW = contentBox.children(":first").width(), slideH = contentBox.children(":first").height(); var autoPlay, slideWH; if ( opts.effect == "scrollY" || opts.effect == "scrollLoopY" ) { slideWH = contentBox.children(":first").outerHeight(true); } else if ( opts.effect == "scrollX" || opts.effect == "scrollLoopX" ) { slideWH = contentBox.children(":first").outerWidth(true); contentBox.css("width" , contentBoxNum * slideWH); contentBox.children().css({"float" : "left"}); contentBox.children().css({"width" : slideW}); } return this.each(function() { // 滚动函数 var doPlay = function() { $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); if ( ++index * opts.steps >= contentBoxNum ) index = 0; } // 点击左右滚动 if ( !targetLi.size() ) { if (clickNext.size()) { clickNext.click(function(event){ if ( autoPlay ) clearInterval( autoPlay ); $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); if ( opts.autoPlay ) autoPlay = setInterval(doPlay, opts.timer); event.preventDefault(); }); clickPrev.click(function(event){ if ( autoPlay ) clearInterval( autoPlay ); $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts, "prev" ); if ( opts.autoPlay ) autoPlay = setInterval(doPlay, opts.timer); event.preventDefault(); }); } } // 导航事件 if ( targetLi.size() ) { if (clickNext.size() && !opts.hasScroll) { var _length = targetLi.size(); clickNext.click(function(event){ for ( var i = 0; i < _length; i++ ) { if ( targetLi.eq(i).hasClass("hover") ) { index = (i + 1 == _length) ? 0 : i + 1; break; } } $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); if ( autoPlay ) clearInterval( autoPlay ); if ( opts.autoPlay ) autoPlay = setInterval(doPlay, opts.timer); return false; }); clickPrev.click(function(event){ for ( var i = 0; i < _length; i++ ) { if ( targetLi.eq(i).hasClass("hover") ) { index = (i == 0) ? _length - 1 : i - 1; break; } } $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); if ( autoPlay ) clearInterval( autoPlay ); if ( opts.autoPlay ) autoPlay = setInterval(doPlay, opts.timer); return false; }); } if ( opts.event == "click" ) { targetLi.click(function(){ if ( autoPlay ) { clearInterval(autoPlay); } index = targetLi.index(this); $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); targetLi.eq(index).addClass("selected").siblings().removeClass("selected"); }).hover(function(){ $(this).addClass("hover"); }, function() { $(this).removeClass("hover"); }); } else if ( opts.event == "hover" ) { var hoverTimeout = null; targetLi.hover(function(){ if ( autoPlay ) { clearInterval(autoPlay); } index = targetLi.index(this); if (!opts.hoverInterval) { $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ); } // hover时延迟 else { hoverTimeout = setTimeout(function(){ $.fn.Switchable.Effect[opts.effect]( contentBox, targetLi, index, slideWH, opts ) }, opts.hoverInterval); } }, function() { if ( hoverTimeout ) clearInterval( hoverTimeout ); if ( autoPlay ) clearInterval( autoPlay ); if ( opts.autoPlay ) autoPlay = setInterval(doPlay, opts.timer); }); } } // 自动播放 if ( opts.autoPlay ) { autoPlay = setInterval( doPlay, opts.timer ); contentBox.hover(function(){ if ( autoPlay ) clearInterval( autoPlay ); }, function() { if ( autoPlay ) clearInterval( autoPlay ); if ( opts.autoPlay ) autoPlay = setInterval( doPlay, opts.timer ); }); } }); } // 默认属性 $.fn.Switchable.Default = { event: "click", effect: "none", autoPlay: true, speed: "normal", timer: 2000, nav: "J_nav", content: "J_content", steps: 1, btnNext:"J_btnNext", btnPrev:"J_btnPrev" }; // 方法实现 $.fn.Switchable.Effect = { none: function( contentObj, navObj, i, slideW, opts ) { contentObj.children().eq(i).show().siblings().hide(); if (navObj) { navObj.eq(i).addClass("hover").siblings().removeClass("hover"); } }, fade: function( contentObj, navObj, i, slideW, opts ) { contentObj.children().eq(i).stop(true, true).fadeIn(opts.speed).siblings().hide(); if (navObj) { navObj.eq(i).addClass("hover").siblings().removeClass("hover"); } }, scrollX: function( contentObj, navObj, i, slideW, opts ) { contentObj.stop().animate({"margin-left" : -i * opts.steps * slideW}, opts.speed); if (navObj) { navObj.eq(i).addClass("hover").siblings().removeClass("hover"); } }, scrollY: function( contentObj, navObj, i, slideH, opts ) { contentObj.stop().animate({"margin-top" : -i * opts.steps * slideH}, opts.speed); if (navObj) { navObj.eq(i).addClass("hover").siblings().removeClass("hover"); } }, scrollLoopX: function( contentObj, navObj, i, slideW, opts, direction ) { direction = direction || "next"; $.fn.Switchable.ScrollLoop[direction]( contentObj, navObj, i, slideW, opts, "X" ); }, scrollLoopY: function( contentObj, navObj, i, slideH, opts, direction ) { direction = direction || "next"; $.fn.Switchable.ScrollLoop[direction]( contentObj, navObj, i, slideH, opts, "Y" ); } }; $.fn.Switchable.ScrollLoop = { prev: function( contentObj, navObj, i, slideWH, opts, xy ) { // 如果当前有移动效果,则屏蔽点击 if (contentObj.is(":animated")) return; for ( var i = 0; i < opts.steps; i++ ) { contentObj.children(":last").prependTo(contentObj); } if ( xy == "X" ) { contentObj.css({"margin-left" : -opts.steps * slideWH}); contentObj.stop().animate({"margin-left" : 0}, opts.speed); } else { contentObj.css({"margin-top" : -opts.steps * slideWH}); contentObj.stop().animate({"margin-top" : 0}, opts.speed); } }, next: function( contentObj, navObj, i, slideWH, opts, xy ) { // 如果有当前移动效果,则屏蔽点击 if (contentObj.is(":animated")) return; if ( xy == "X" ) { contentObj.stop().animate({"margin-left" : -opts.steps * slideWH}, opts.speed, function(){ for (var i = 0; i < opts.steps; i++) { contentObj.children(":first").appendTo(contentObj); } contentObj.css({"margin-left" : 0}); }); } else { contentObj.stop().animate({"margin-top" : -opts.steps * slideWH}, opts.speed, function(){ for (var i = 0; i < opts.steps; i++) { contentObj.children(":first").appendTo(contentObj); } contentObj.css({"margin-top" : 0}); }); } } } })(jQuery); var KISSDW = { // 选项卡 tabs: function( selector, options ) { var _default = { nav: "J_nav:eq(0)", content: "J_content:eq(0)", autoPlay: false }; if ( options && !options.hoverInterval && options.event === "hover" ) { _default.hoverInterval = 300; } var opts = jQuery.extend( {}, _default, options ); jQuery(selector).Switchable( opts ); }, // 头图幻灯片 slide: function( selector, options ) { var _default = { event: "hover", effect: "fade", timer: 5000 }; var opts = jQuery.extend( {}, _default, options ); jQuery(selector).Switchable( opts ); }, // 文章滚动 textScroll: function( selector, options ) { var _default = { effect: "scrollLoopY", timer: 4000 }; var opts = jQuery.extend( {}, _default, options ); jQuery(selector).Switchable( opts ); }, // 图片滚动 imageScroll: function( selector, options ) { var _default = { effect: "scrollLoopX" }; var opts = jQuery.extend( {}, _default, options ); jQuery(selector).Switchable( opts ); }, /******************************* 以上部分运用了Switchable插件 *******************************/ // 活动日历(默认日期) calendar: function( selector, options ) { var _default = { event: "click", fromSunday: false }; var opts = jQuery.extend( {}, _default, options ); var day = new Date().getDay(), dayNum = day; if ( !opts.fromSunday ) { dayNum = day == 0 ? 6 : day - 1; } var _eventStr = "selected"; if ( opts.event == "hover" ) { _eventStr = "hover"; } jQuery(selector).find(".J_nav > li").eq(dayNum).addClass(_eventStr); jQuery(selector).find(".J_content > div").eq(dayNum).removeClass("hide"); // v2.1 jQuery(selector).find(".J_content > li").eq(dayNum).removeClass("hide"); this.tabs( selector, options ); }, // 输入flash代码 embedSWF: function( selector, options ) { var flashBox = jQuery(selector)[0]; if ( !flashBox ) return; var _default = { url: "", width: jQuery(flashBox).width(), height: jQuery(flashBox).height(), wmode: "transparent" }; var opts = jQuery.extend( {}, _default, options ); if ( opts.url === "" ) return; var str = ''; flashBox.innerHTML = str; }, // 预加载图片 preLoadImg: function( urls ) { for ( var i = 0; i < urls.length; i++ ) { var img = new Image(); img.src = urls[i]; } }, // 手风琴 accordion: function( selector ) { //max if ( !jQuery(selector).is("div[class*='mod-accordion']") ) return false; var accord = jQuery(selector), accordHead = accord.children("div:even"), accordBody = accord.children("div:odd"), accordLength = accordHead.length; accordHead.click(function(){ var _index = accordHead.index(this); var _ifSelf = accordHead.eq(_index).hasClass("active"); accordHead.removeClass("active"); accordBody.removeClass("show"); if (_ifSelf) { _index = (accordLength != _index + 1) ? ++_index : --_index; } accordHead.eq(_index).addClass("active"); accordBody.eq(_index).addClass("show"); // accordBody.stop().slideUp("normal").eq(_index).slideDown("normal"); }); }, // 遮罩弹出层(selector为"none"时,直接跳出弹出框) popupBox: function( selector, options ) { var el = jQuery(selector); if ( !el.length && selector !== "none" ) return; if ( !options || !options.boxSelector ) return; // 点击事件 if ( el.length ) el.click(function(){ popFun(); return false; }); function popFun() { var box = jQuery(options.boxSelector)[0]; if ( !box ) return; var _default = { existMask: true }; var opts = jQuery.extend( {}, _default, options ); // 创建遮罩,显示弹出框 this.open_popu = function(maskCss, boxCss) { this.box.style.cssText = boxCss; this.mask.style.cssText = maskCss; // 解决ie6 bug if(!window.XMLHttpRequest) { document.documentElement.scrollTop++; document.documentElement.scrollTop--; } if ( opts.existMask ) document.body.appendChild(this.mask); }, // 关闭遮罩 this.close_popu = function() { // ie6 清空css表达式 this.box.style.cssText = ""; this.box.style.display = "none"; if ( opts.existMask ) document.body.removeChild(this.mask); } this.box = box; this.mask = document.createElement("div"); // dom宽高 this.box.style.display = "block"; var boxWidth = this.box.clientWidth, boxHeight = this.box.clientHeight; // 创建遮罩,显示弹出框 var maskCss = "position:fixed;left:0;top:0;z-index:32766;width:100%;height:100%;filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;background:#000;", boxCss = "display:block;position:fixed;left:50%;top:50%;z-index:32767;margin:-" + boxHeight / 2 + "px 0 0 -" + boxWidth / 2 + "px;"; // ie6 if(!window.XMLHttpRequest) { // ie6 css表达式 maskCss += "position:absolute;top:expression(documentElement.scrollTop);height:expression(document.documentElement.clientHeight);"; boxCss += "position:absolute;top:expression(documentElement.scrollTop + document.documentElement.clientHeight/2);"; // 解决ie6 bug(没设置html背景的时候) if ( document.getElementsByTagName("html")[0].style.backgroundImage == "") { document.getElementsByTagName("html")[0].style.backgroundImage = "url(blank)"; } } this.open_popu(maskCss, boxCss); // 关闭弹出框事件设置(约定关闭按钮classname为J_btnClose) var tags = this.box.getElementsByTagName("*"); for (var i = 0; i < tags.length; i++) { if ( jQuery(tags[i]).hasClass("J_btnClose") ) { var self = this; tags[i].onclick = function() { self.close_popu(); return false; } } } return false; } if ( selector === "none" ) popFun(); }, ///////////////////////////// // 站内导航树 navTree: function( selector, options ) { var _default = { showAll: false }; var opts = jQuery.extend( {}, _default, options ); if (jQuery(selector).length) { // ie if (!-[1, ]) { jQuery(selector + " ul").each(function(){ jQuery(this).children("li:last-child").addClass("last-child"); }); } jQuery(selector + ">ul>li").each(function(){ var ul = jQuery(this).find("ul:first"); if (!ul.length) return; if ( opts.showAll ) { ul.attr("class", "show"); } var span = jQuery(""); span.prependTo(ul.siblings("b")); span.height = ul.height(); span.status = "visible"; if (ul.attr("class") !== "show") { ul.css("height", "0"); span.status = "hidden"; } span.click(function(){ if (span.status === "hidden") { span.status = "visible"; ul.animate({height: span.height}, 500); } else { span.status = "hidden"; ul.animate({height: 0}, 500); } }); }); } }, // 站内导航树 navTree2: function( selector, options ) { var _default = { showAll: false, effect: false, clickIcon: false, speed: "normal" }; var opts = jQuery.extend( {}, _default, options ); var navTree = jQuery(selector); navTree.find("ul").each(function(){ jQuery(this).children("li:last-child").addClass("last"); }); function animate( div ) { var parentLi = div.parent(), // div父元素 siblingsUl = div.siblings("ul"); // div的兄弟元素 // 是否动态效果 if ( opts.effect ) { if ( siblingsUl.is(":visible") ) { siblingsUl.slideUp(opts.speed, function(){ parentLi.toggleClass("close"); }); } else { if ( !siblingsUl.attr("noFirst") ) { siblingsUl.slideDown(opts.speed, function(){ parentLi.toggleClass("close"); }); } else { parentLi.toggleClass("close"); siblingsUl.slideDown(opts.speed); } } siblingsUl.attr("noFirst", true); // 解决第一次打开close直接弹开的情况 } else { parentLi.toggleClass("close"); } } // 是否点击icon弹开 if ( opts.clickIcon ) { navTree.find("li:has(ul)").children("div").prepend("").children("i").click(function(){ animate( jQuery(this).parent() ); }); } else { navTree.find("li:has(ul)").children("div").prepend("").click(function(){ animate( jQuery(this) ); }); } // 是否全部结构显示 if ( !opts.showAll ) { navTree.find("li li:has(ul):not(.open)").addClass("close"); } }, toolTips: function( options ) { var _default = { imgSrc: "", style: 1, offset: {x: 15, y: 15} }; var opts = jQuery.extend( {}, _default, options ); // 样式一 if ( opts.style === 1 ) { var cssImgText = ""; if (opts.imgSrc != "") { cssImgText = '.data-tips-left, .data-tips-center, .data-tips-right{background-image:url(' + opts.imgSrc + ')}'; } document.write(''); } // 分配事件 var aTags = document.getElementsByTagName("a"); for (var i = 0; i < aTags.length; i++) { if (aTags[i].getAttribute("data-tips") != null) { aTags[i].onmouseover = mouseover; aTags[i].onmousemove = mousemove; aTags[i].onmouseout = mouseout; } } // 鼠标移上或离开 function isMouseLeaveOrEnter(e, handler) { if (e.type != 'mouseout' && e.type != 'mouseover') return false; var reltg = e.relatedTarget ? e.relatedTarget : e.type == 'mouseout' ? e.toElement : e.fromElement; while (reltg && reltg != handler) reltg = reltg.parentNode; return (reltg != handler); } // 鼠标移上 function mouseover() { var event = window.event || arguments[0], srcElement = event.srcElement || event.target; if(!isMouseLeaveOrEnter(event, this)) return; while (srcElement && !srcElement.getAttribute("data-tips")) srcElement = srcElement.parentNode; var html = ""; switch (opts.style) { // 样式一 case 1: html = '