/** * created by administrator on 2017/6/13. */ $(function(){ //导航栏 $('.head_nav_list>li').on('mouseenter',function(){ $('.head_nav_list>li').removeclass('nav_active').eq($(this).index()).addclass('nav_active'); $(this).find('.second_menu').css('height',$(this).find('.second_menu > li').length * 60 + 'px'); }); $('.head_nav_list>li').on('mouseleave',function(){ $(this).find('.second_menu').css('height','0'); }); //返回顶部 window.onload = function () { var obtn=document.getelementbyid('top_btn'); window.onscroll=function(){ var scrolltop=document.documentelement.scrolltop || document.body.scrolltop; if(scrolltop>400){ obtn.style.display='block'; }else{ obtn.style.display='none'; } }; var timer; obtn.onclick=function(){ var scrolltop=document.documentelement.scrolltop || document.body.scrolltop; var start=scrolltop; var dis=0-start; var count=math.floor(1000/30); var n=0; clearinterval(timer); timer=setinterval(function(){ n++; var a=n/count; var cur=start+dis*a; document.documentelement.scrolltop=document.body.scrolltop=cur; if(n==count){ clearinterval(timer); } }, 10); }; }; }); /* 幻灯片插件 jquery orbit plugin 1.2.3 */ (function($) { $.fn.orbit = function(options) { //defaults to extend options var defaults = { animation: 'fade', //幻灯片切换方式,可选 fade, horizontal-slide, vertical-slide, horizontal-push animationspeed: 1000, //幻灯片切换动画时间,单位为毫秒 timer: true, //是否显示计时器 advancespeed: 4000, //幻灯片切换间隔,单位为毫秒 pauseonhover: true, //鼠标悬停在上面是否暂停 startclockonmouseout: true, //点击导航后是否暂停计时器,直到鼠标移开 startclockonmouseoutafter: 0, //鼠标移开后多久开始计时,单位为毫秒 directionalnav: true, //是否显示左右方向导航 captions: false, //是否显示标题 captionanimation: 'fade', //标题显示动画方式,可选 fade(淡入淡出)、slideopen、none,需要 captions 为 true captionanimationspeed: 600, //标题动画时间,单位为毫秒 bullets: true, //是否显示项目导航 bulletthumbs: false, //是否显示缩略图,需要 bullets 为 true bulletthumblocation: '', //缩略图的文件地址 afterslidechange: function(){} //幻灯片切换后的回调函数 }; //extend those options var options = $.extend(defaults, options); return this.each(function() { // ============== // ! setup // ============== //global variables var activeslide = 0, numberslides = 0, orbitwidth, orbitheight, locked; //initialize var orbit = $(this).addclass('orbit'), orbitwrapper = orbit.wrap('
').parent(); var orbitid = orbit.attr('id'); orbitwrapper.addclass(orbitid); orbit.add(orbitwidth).width('1px').height('1px'); //collect all slides and set slider size of largest image var slides = orbit.children('li'); slides.each(function() { var _slide = $(this), _slidewidth = _slide.width(), _slideheight = _slide.height(); if(_slidewidth > orbit.width()) { orbit.add(orbitwrapper).width(_slidewidth); orbitwidth = orbit.width(); } if(_slideheight > orbit.height()) { orbit.add(orbitwrapper).height(_slideheight); orbitheight = orbit.height(); } numberslides++; }); //animation locking functions function unlock() { locked = false; } function lock() { locked = true; } //if there is only a single slide remove nav, timer and bullets if(slides.length == 1) { options.directionalnav = false; options.timer = false; options.bullets = false; } //set initial front photo z-index and fades it in slides.eq(activeslide) .css({"z-index" : 3}) .fadein(function() { //brings in all other slides if css declares a display: none slides.css({"display":"block"}) }); // ============== // ! timer // ============== //timer execution function startclock() { if(!options.timer || options.timer == 'false') { return false; //if timer is hidden, don't need to do crazy calculations } else if(timer.is(':hidden')) { clock = setinterval(function(e){ shift("next"); }, options.advancespeed); //if timer is visible and working, let's do some math } else { timerrunning = true; pause.removeclass('active') clock = setinterval(function(e){ var degreecss = "rotate("+degrees+"deg)" degrees += 2 rotator.css({ "-webkit-transform": degreecss, "-moz-transform": degreecss, "-o-transform": degreecss }); if(degrees > 180) { rotator.addclass('move'); mask.addclass('move'); } if(degrees > 360) { rotator.removeclass('move'); mask.removeclass('move'); degrees = 0; shift("next"); } }, options.advancespeed/180); } } function stopclock() { if(!options.timer || options.timer == 'false') { return false; } else { timerrunning = false; clearinterval(clock); pause.addclass('active'); } } //timer setup if(options.timer) { var timerhtml = '
' orbitwrapper.append(timerhtml); var timer = orbitwrapper.children('div.timer'), timerrunning; if(timer.length != 0) { var rotator = $('div.timer span.rotator'), mask = $('div.timer span.mask'), pause = $('div.timer span.pause'), degrees = 0, clock; startclock(); timer.click(function() { if(!timerrunning) { startclock(); } else { stopclock(); } }); if(options.startclockonmouseout){ var outtimer; orbitwrapper.mouseleave(function() { outtimer = settimeout(function() { if(!timerrunning){ startclock(); } }, options.startclockonmouseoutafter) }) orbitwrapper.mouseenter(function() { cleartimeout(outtimer); }) } } } //pause timer on hover if(options.pauseonhover) { orbitwrapper.mouseenter(function() { stopclock(); }); } // ============== // ! captions // ============== //caption setup if(options.captions) { var captionhtml = '
'; orbitwrapper.append(captionhtml); var caption = orbitwrapper.children('.orbit-caption'); setcaption(); } //caption execution function setcaption() { if(!options.captions || options.captions =="false") { return false; } else { var _captionlocation = slides.eq(activeslide).data('caption'); //get id from rel tag on image _captionhtml = $(_captionlocation).html(); //get html from the matching html entity //set html for the caption if it exists if(_captionhtml) { caption .attr('id',_captionlocation) // add id caption .html(_captionhtml); // change html in caption //animations for caption entrances if(options.captionanimation == 'none') { caption.show(); } if(options.captionanimation == 'fade') { caption.fadein(options.captionanimationspeed); } if(options.captionanimation == 'slideopen') { caption.slidedown(options.captionanimationspeed); } } else { //animations for caption exits if(options.captionanimation == 'none') { caption.hide(); } if(options.captionanimation == 'fade') { caption.fadeout(options.captionanimationspeed); } if(options.captionanimation == 'slideopen') { caption.slideup(options.captionanimationspeed); } } } } // ================== // ! directional nav // ================== //directionalnav { rightbutton --> shift("next"), leftbutton --> shift("prev"); if(options.directionalnav) { if(options.directionalnav == "false") { return false; } var directionalnavhtml = '
rightleft
'; orbitwrapper.append(directionalnavhtml); var leftbtn = orbitwrapper.children('div.slider-nav').children('span.left'), rightbtn = orbitwrapper.children('div.slider-nav').children('span.right'); leftbtn.click(function() { stopclock(); shift("prev"); }); rightbtn.click(function() { stopclock(); shift("next") }); } // ================== // ! bullet nav // ================== //bullet nav setup if(options.bullets) { var bullethtml = ''; orbitwrapper.append(bullethtml); var bullets = orbitwrapper.children('ul.orbit-bullets'); for(i=0; i'+(i+1)+''); if(options.bulletthumbs) { var thumbname = slides.eq(i).data('thumb'); if(thumbname) { var limarkup = $('
  • '+i+'
  • ') limarkup.css({"background" : "url("+options.bulletthumblocation+thumbname+") no-repeat"}); } } orbitwrapper.children('ul.orbit-bullets').append(limarkup); limarkup.data('index',i); limarkup.click(function() { stopclock(); shift($(this).data('index')); }); } setactivebullet(); } //bullet nav execution function setactivebullet() { if(!options.bullets) { return false; } else { bullets.children('li').removeclass('active').eq(activeslide).addclass('active'); } } // ==================== // ! shift animations // ==================== //animating the shift! function shift(direction) { //remember previous activeslide var prevactiveslide = activeslide, slidedirection = direction; //exit function if bullet clicked is same as the current image if(prevactiveslide == slidedirection) { return false; } //reset z & unlock function resetandunlock() { slides .eq(prevactiveslide) .css({"z-index" : 1}); unlock(); options.afterslidechange.call(this); } if(slides.length == "1") { return false; } if(!locked) { lock(); //deduce the proper activeimage if(direction == "next") { activeslide++ if(activeslide == numberslides) { activeslide = 0; } } else if(direction == "prev") { activeslide-- if(activeslide < 0) { activeslide = numberslides-1; } } else { activeslide = direction; if (prevactiveslide < activeslide) { slidedirection = "next"; } else if (prevactiveslide > activeslide) { slidedirection = "prev" } } //set to correct bullet setactivebullet(); //set previous slide z-index to one below what new activeslide will be slides .eq(prevactiveslide) .css({"z-index" : 2}); //fade if(options.animation == "fade") { slides .eq(activeslide) .css({"opacity" : 0, "z-index" : 3}) .animate({"opacity" : 1}, options.animationspeed, resetandunlock); } //horizontal-slide if(options.animation == "horizontal-slide") { if(slidedirection == "next") { slides .eq(activeslide) .css({"left": orbitwidth, "z-index" : 3}) .animate({"left" : 0}, options.animationspeed, resetandunlock); } if(slidedirection == "prev") { slides .eq(activeslide) .css({"left": -orbitwidth, "z-index" : 3}) .animate({"left" : 0}, options.animationspeed, resetandunlock); } } //vertical-slide if(options.animation == "vertical-slide") { if(slidedirection == "prev") { slides .eq(activeslide) .css({"top": orbitheight, "z-index" : 3}) .animate({"top" : 0}, options.animationspeed, resetandunlock); } if(slidedirection == "next") { slides .eq(activeslide) .css({"top": -orbitheight, "z-index" : 3}) .animate({"top" : 0}, options.animationspeed, resetandunlock); } } //push-over if(options.animation == "horizontal-push") { if(slidedirection == "next") { slides .eq(activeslide) .css({"left": orbitwidth, "z-index" : 3}) .animate({"left" : 0}, options.animationspeed, resetandunlock); slides .eq(prevactiveslide) .animate({"left" : -orbitwidth}, options.animationspeed); } if(slidedirection == "prev") { slides .eq(activeslide) .css({"left": -orbitwidth, "z-index" : 3}) .animate({"left" : 0}, options.animationspeed, resetandunlock); slides .eq(prevactiveslide) .animate({"left" : orbitwidth}, options.animationspeed); } } setcaption(); } //lock }//orbit function });//each call }//orbit plugin call })(jquery); $(document).ready(function(){ /*图片幻灯片,用于普通尺寸幻灯*/ $('#featured').orbit({}); $('#featured2').orbit({animation: 'horizontal-slide',directionalnav: false}); $('#featured3').orbit({}); }) //选项卡 function qtabs(obj,cur,events){ $("[id^='qtabs_']").each(function(){ var trigger = $(this).children(); var cid = $(this).attr("id").substring(6); var content = $("#"+cid).children(); trigger.removeclass("current"); trigger.eq(0).addclass("current"); //触发元素设置选中样式 content.hide(); content.eq(0).show(); //内容选中显示 trigger.on("click",function(){ trigger.removeclass("current"); $(this).addclass("current"); content.hide(); var n=$(this).index(); content.eq(n).show(); }); }) } $(document).ready(function(){ qtabs(); }); /*调用 应用示例
    触发元素集合
    内容元素集合
    */