/* _ _ _____ _ _ | | | __ \ | | (_) ___ ___ _ __ ___ | | | |__) |_____ _____ __ _| | _ ___ / __|/ __| '__/ _ \| | | _ // _ \ \ / / _ \/ _` | | | / __| \__ \ (__| | | (_) | | | | \ \ __/\ V / __/ (_| | |_| \__ \ |___/\___|_| \___/|_|_|_| \_\___| \_/ \___|\__,_|_(_) |___/ v.0.1.3 _/ | |__/ "Declarative on-scroll reveal animations." /*============================================================================= scrollReveal.js was inspired by cbpScroller.js (c) 2014 Codrops. Licensed under the MIT license. http://www.opensource.org/licenses/mit-license.php =============================================================================*/ /*! scrollReveal.js v0.1.3 (c) 2014 Julian Lloyd | MIT license */ /*===========================================================================*/ $(function(){ //从底部上升的遮罩效果开始 $(".con").hover(function(){ $(this).find(".txt").stop().animate({"left": 0,"top":0},300); },function(){ $(this).find(".txt").stop().animate({"left":0,"top":525},300); }) }); //从底部上升的遮罩效果结束 window.scrollReveal = (function (window) { 'use strict'; // generator (increments) for the next scroll-reveal-id var nextId = 1; /** * RequestAnimationFrame polyfill * @function * @private */ var requestAnimFrame = (function () { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function (callback) { window.setTimeout(callback, 1000 / 60); }; }()); function scrollReveal(options) { this.options = this.extend(this.defaults, options); this.docElem = this.options.elem; this.styleBank = {}; if (this.options.init == true) this.init(); } scrollReveal.prototype = { defaults: { after: '0s', enter: 'bottom', move: '24px', over: '0.66s', easing: 'ease-in-out', opacity: 0, complete: function() {}, // if 0, the element is considered in the viewport as soon as it enters // if 1, the element is considered in the viewport when it's fully visible viewportFactor: 0.33, // if false, animations occur only once // if true, animations occur each time an element enters the viewport reset: false, // if true, scrollReveal.init() is automaticaly called upon instantiation init: true, elem: window.document.documentElement }, /*=============================================================================*/ init: function () { this.scrolled = false; var self = this; // Check DOM for the data-scrollReveal attribute // and initialize all found elements. this.elems = Array.prototype.slice.call(this.docElem.querySelectorAll('[data-scroll-reveal]')); this.elems.forEach(function (el, i) { // Capture original style attribute var id = el.getAttribute("data-scroll-reveal-id"); if (!id) { id = nextId++; el.setAttribute("data-scroll-reveal-id", id); } if (!self.styleBank[id]) { self.styleBank[id] = el.getAttribute('style'); } self.update(el); }); var scrollHandler = function (e) { // No changing, exit if (!self.scrolled) { self.scrolled = true; requestAnimFrame(function () { self._scrollPage(); }); } }; var resizeHandler = function () { // If we're still waiting for settimeout, reset the timer. if (self.resizeTimeout) { clearTimeout(self.resizeTimeout); } function delayed() { self._scrollPage(); self.resizeTimeout = null; } self.resizeTimeout = setTimeout(delayed, 200); }; // captureScroll if (this.docElem == window.document.documentElement) { window.addEventListener('scroll', scrollHandler, false); window.addEventListener('resize', resizeHandler, false); } else { this.docElem.addEventListener('scroll', scrollHandler, false); } }, /*=============================================================================*/ _scrollPage: function () { var self = this; this.elems.forEach(function (el, i) { self.update(el); }); this.scrolled = false; }, /*=============================================================================*/ parseLanguage: function (el) { // Splits on a sequence of one or more commas or spaces. var words = el.getAttribute('data-scroll-reveal').split(/[, ]+/), parsed = {}; function filter (words) { var ret = [], blacklist = [ "from", "the", "and", "then", "but", "with" ]; words.forEach(function (word, i) { if (blacklist.indexOf(word) > -1) { return; } ret.push(word); }); return ret; } words = filter(words); words.forEach(function (word, i) { switch (word) { case "enter": parsed.enter = words[i + 1]; return; case "after": parsed.after = words[i + 1]; return; case "wait": parsed.after = words[i + 1]; return; case "move": parsed.move = words[i + 1]; return; case "ease": parsed.move = words[i + 1]; parsed.ease = "ease"; return; case "ease-in": parsed.move = words[i + 1]; parsed.easing = "ease-in"; return; case "ease-in-out": parsed.move = words[i + 1]; parsed.easing = "ease-in-out"; return; case "ease-out": parsed.move = words[i + 1]; parsed.easing = "ease-out"; return; case "over": parsed.over = words[i + 1]; return; default: return; } }); return parsed; }, /*=============================================================================*/ update: function (el) { var that = this; var css = this.genCSS(el); var style = this.styleBank[el.getAttribute("data-scroll-reveal-id")]; if (style != null) style += ";"; else style = ""; if (!el.getAttribute('data-scroll-reveal-initialized')) { el.setAttribute('style', style + css.initial); el.setAttribute('data-scroll-reveal-initialized', true); } if (!this.isElementInViewport(el, this.options.viewportFactor)) { if (this.options.reset) { el.setAttribute('style', style + css.initial + css.reset); } return; } if (el.getAttribute('data-scroll-reveal-complete')) return; if (this.isElementInViewport(el, this.options.viewportFactor)) { el.setAttribute('style', style + css.target + css.transition); // Without reset enabled, we can safely remove the style tag // to prevent CSS specificy wars with authored CSS. if (!this.options.reset) { setTimeout(function () { if (style != "") { el.setAttribute('style', style); } else { el.removeAttribute('style'); } el.setAttribute('data-scroll-reveal-complete',true); that.options.complete(el); }, css.totalDuration); } return; } }, /*=============================================================================*/ genCSS: function (el) { var parsed = this.parseLanguage(el), enter, axis; if (parsed.enter) { if (parsed.enter == "top" || parsed.enter == "bottom") { enter = parsed.enter; axis = "y"; } if (parsed.enter == "left" || parsed.enter == "right") { enter = parsed.enter; axis = "x"; } } else { if (this.options.enter == "top" || this.options.enter == "bottom") { enter = this.options.enter axis = "y"; } if (this.options.enter == "left" || this.options.enter == "right") { enter = this.options.enter axis = "x"; } } // After all values are parsed, let's make sure our our // pixel distance is negative for top and left entrances. // // ie. "move 25px from top" starts at 'top: -25px' in CSS. if (enter == "top" || enter == "left") { if (parsed.move) { parsed.move = "-" + parsed.move; } else { parsed.move = "-" + this.options.move; } } var dist = parsed.move || this.options.move, dur = parsed.over || this.options.over, delay = parsed.after || this.options.after, easing = parsed.easing || this.options.easing, opacity = parsed.opacity || this.options.opacity; var transition = "-webkit-transition: -webkit-transform " + dur + " " + easing + " " + delay + ", opacity " + dur + " " + easing + " " + delay + ";" + "transition: transform " + dur + " " + easing + " " + delay + ", opacity " + dur + " " + easing + " " + delay + ";" + "-webkit-perspective: 1000;" + "-webkit-backface-visibility: hidden;"; // The same as transition, but removing the delay for elements fading out. var reset = "-webkit-transition: -webkit-transform " + dur + " " + easing + " 0s, opacity " + dur + " " + easing + " " + delay + ";" + "transition: transform " + dur + " " + easing + " 0s, opacity " + dur + " " + easing + " " + delay + ";" + "-webkit-perspective: 1000;" + "-webkit-backface-visibility: hidden;"; var initial = "-webkit-transform: translate" + axis + "(" + dist + ");" + "transform: translate" + axis + "(" + dist + ");" + "opacity: " + opacity + ";"; var target = "-webkit-transform: translate" + axis + "(0);" + "transform: translate" + axis + "(0);" + "opacity: 1;"; return { transition: transition, initial: initial, target: target, reset: reset, totalDuration: ((parseFloat(dur) + parseFloat(delay)) * 1000) }; }, getViewportH : function () { var client = this.docElem['clientHeight'], inner = window['innerHeight']; if (this.docElem == window.document.documentElement) return (client < inner) ? inner : client; else return client; }, getOffset : function(el) { var offsetTop = 0, offsetLeft = 0; do { if (!isNaN(el.offsetTop)) { offsetTop += el.offsetTop; } if (!isNaN(el.offsetLeft)) { offsetLeft += el.offsetLeft; } } while (el = el.offsetParent) return { top: offsetTop, left: offsetLeft } }, isElementInViewport : function(el, h) { var scrolled = this.docElem.scrollTop + this.docElem.offsetTop; if (this.docElem == window.document.documentElement)scrolled = window.pageYOffset; var viewed = scrolled + this.getViewportH(), elH = el.offsetHeight, elTop = this.getOffset(el).top, elBottom = elTop + elH, h = h || 0; return (elTop + elH * h) <= viewed && (elBottom) >= scrolled || (el.currentStyle? el.currentStyle : window.getComputedStyle(el, null)).position == 'fixed'; }, extend: function (a, b){ for (var key in b) { if (b.hasOwnProperty(key)) { a[key] = b[key]; } } return a; } }; // end scrollReveal.prototype return scrollReveal; })(window); //--------------------------------收藏js-------------------------------------// //收藏本页 function AddFavorite(sURL, sTitle){ try{ window.external.addFavorite(sURL, sTitle); } catch(e){ try{ window.sidebar.addPanel(sTitle, sURL, ""); } catch(e){ alert("加入收藏失败,请使用Ctrl+D进行添加"); }; }; }; //收藏设置页面(首页) function addToFavorite(){ var d="http://www.btoe.com/"; var c="你的网站名字"; if(document.all){ window.external.AddFavorite(d,c); }else{ if(window.sidebar){ window.sidebar.addPanel(c,d,""); }else{ alert("对不起,您的浏览器不支持此操作!\n请您使用菜单栏或Ctrl+D收藏本站。"); } } } //设为首页 function SetHome(obj){ try{ obj.style.behavior='url(#default#homepage)'; obj.setHomePage('http://www.btoe.com/'); }catch(e){ if(window.netscape){ try{ netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect"); }catch(e){ alert("抱歉,此操作被浏览器拒绝!\n\n请在浏览器地址栏输入并回车然后将[signed.applets.codebase_principal_support]设置为'true'"); }; }else{ alert("抱歉,您所使用的浏览器无法完成此操作。\n\n您需要手动设置首页。"); }; }; }; //--------------------------------导航 js-------------------------------------// function dropMenu(obj){ $(obj).each(function(){ var theSpan = $(this); var theMenu = theSpan.find(".submenu"); var tarHeight = theMenu.height(); theMenu.css({height:0,opacity:0}); var t1; function expand() { clearTimeout(t1); theSpan.find('a').addClass("selected"); theMenu.stop().show().animate({height:tarHeight,opacity:1},200); } function collapse() { clearTimeout(t1); t1 = setTimeout(function(){ theSpan.find('a').removeClass("selected"); theMenu.stop().animate({height:0,opacity:0},200,function(){ $(this).css({display:"none"}); }); }, 250); } theSpan.hover(expand, collapse); theMenu.hover(expand, collapse); }); } $(document).ready(function(){ dropMenu(".nav_li"); }); //--------------------------------图片滚动 js---------------------------------------// /*ScrollPic.js*/ var sina = { $: function (objName) { if (document.getElementById) { return eval('document.getElementById("' + objName + '")') } else { return eval('document.all.' + objName) } }, isIE: navigator.appVersion.indexOf("MSIE") != -1 ? true : false, addEvent: function (l, i, I) { if (l.attachEvent) { l.attachEvent("on" + i, I) } else { l.addEventListener(i, I, false) } }, delEvent: function (l, i, I) { if (l.detachEvent) { l.detachEvent("on" + i, I) } else { l.removeEventListener(i, I, false) } }, readCookie: function (O) { var o = "", l = O + "="; if (document.cookie.length > 0) { var i = document.cookie.indexOf(l); if (i != -1) { i += l.length; var I = document.cookie.indexOf(";", i); if (I == -1) I = document.cookie.length; o = unescape(document.cookie.substring(i, I)) } }; return o }, writeCookie: function (i, l, o, c) { var O = "", I = ""; if (o != null) { O = new Date((new Date).getTime() + o * 3600000); O = "; expires=" + O.toGMTString() }; if (c != null) { I = ";domain=" + c }; document.cookie = i + "=" + escape(l) + O + I }, readStyle: function (I, l) { if (I.style[l]) { return I.style[l] } else if (I.currentStyle) { return I.currentStyle[l] } else if (document.defaultView && document.defaultView.getComputedStyle) { var i = document.defaultView.getComputedStyle(I, null); return i.getPropertyValue(l) } else { return null } } }; //滚动图片构造函数 //UI&UE Dept. mengjia //080623 function ScrollPic(scrollContId, arrLeftId, arrRightId, dotListId) { this.scrollContId = scrollContId; this.arrLeftId = arrLeftId; this.arrRightId = arrRightId; this.dotListId = dotListId; this.dotClassName = "dotItem"; this.dotOnClassName = "dotItemOn"; this.dotObjArr = []; this.pageWidth = 0; this.frameWidth = 0; this.speed = 10; this.space = 10; this.pageIndex = 0; this.autoPlay = true; this.autoPlayTime = 5; var _autoTimeObj, _scrollTimeObj, _state = "ready"; this.stripDiv = document.createElement("DIV"); this.listDiv01 = document.createElement("DIV"); this.listDiv02 = document.createElement("DIV"); if (!ScrollPic.childs) { ScrollPic.childs = [] }; this.ID = ScrollPic.childs.length; ScrollPic.childs.push(this); this.initialize = function () { if (!this.scrollContId) { throw new Error("必须指定scrollContId."); return }; this.scrollContDiv = sina.$(this.scrollContId); if (!this.scrollContDiv) { throw new Error("scrollContId不是正确的对象.(scrollContId = \"" + this.scrollContId + "\")"); return }; this.scrollContDiv.style.width = this.frameWidth + "px"; this.scrollContDiv.style.overflow = "hidden"; this.listDiv01.innerHTML = this.listDiv02.innerHTML = this.scrollContDiv.innerHTML; this.scrollContDiv.innerHTML = ""; this.scrollContDiv.appendChild(this.stripDiv); this.stripDiv.appendChild(this.listDiv01); this.stripDiv.appendChild(this.listDiv02); this.stripDiv.style.overflow = "hidden"; this.stripDiv.style.zoom = "1"; this.stripDiv.style.width = "32766px"; if(!+[1,]){this.listDiv01.style.styleFloat="left";this.listDiv02.style.styleFloat="left";}else{this.listDiv01.style.cssFloat="left";this.listDiv02.style.cssFloat="left";} sina.addEvent(this.scrollContDiv, "mouseover", Function("ScrollPic.childs[" + this.ID + "].stop()")); sina.addEvent(this.scrollContDiv, "mouseout", Function("ScrollPic.childs[" + this.ID + "].play()")); if (this.arrLeftId) { this.arrLeftObj = sina.$(this.arrLeftId); if (this.arrLeftObj) { sina.addEvent(this.arrLeftObj, "mousedown", Function("ScrollPic.childs[" + this.ID + "].rightMouseDown()")); sina.addEvent(this.arrLeftObj, "mouseup", Function("ScrollPic.childs[" + this.ID + "].rightEnd()")); sina.addEvent(this.arrLeftObj, "mouseout", Function("ScrollPic.childs[" + this.ID + "].rightEnd()")) } }; if (this.arrRightId) { this.arrRightObj = sina.$(this.arrRightId); if (this.arrRightObj) { sina.addEvent(this.arrRightObj, "mousedown", Function("ScrollPic.childs[" + this.ID + "].leftMouseDown()")); sina.addEvent(this.arrRightObj, "mouseup", Function("ScrollPic.childs[" + this.ID + "].leftEnd()")); sina.addEvent(this.arrRightObj, "mouseout", Function("ScrollPic.childs[" + this.ID + "].leftEnd()")) } }; if (this.dotListId) { this.dotListObj = sina.$(this.dotListId); if (this.dotListObj) { var pages = Math.round(this.listDiv01.offsetWidth / this.frameWidth + 0.4), i, tempObj; for (i = 0; i < pages; i++) { tempObj = document.createElement("span"); this.dotListObj.appendChild(tempObj); this.dotObjArr.push(tempObj); if (i == this.pageIndex) { tempObj.className = this.dotClassName } else { tempObj.className = this.dotOnClassName }; tempObj.title = "第" + (i + 1) + "页"; sina.addEvent(tempObj, "click", Function("ScrollPic.childs[" + this.ID + "].pageTo(" + i + ")")) } } }; if (this.autoPlay) { this.play() } }; this.leftMouseDown = function () { if (_state != "ready") { return }; _state = "floating"; _scrollTimeObj = setInterval("ScrollPic.childs[" + this.ID + "].moveLeft()", this.speed) }; this.rightMouseDown = function () { if (_state != "ready") { return }; _state = "floating"; _scrollTimeObj = setInterval("ScrollPic.childs[" + this.ID + "].moveRight()", this.speed) }; this.moveLeft = function () { if (this.scrollContDiv.scrollLeft + this.space >= this.listDiv01.scrollWidth) { this.scrollContDiv.scrollLeft = this.scrollContDiv.scrollLeft + this.space - this.listDiv01.scrollWidth } else { this.scrollContDiv.scrollLeft += this.space }; this.accountPageIndex() }; this.moveRight = function () { if (this.scrollContDiv.scrollLeft - this.space <= 0) { this.scrollContDiv.scrollLeft = this.listDiv01.scrollWidth + this.scrollContDiv.scrollLeft - this.space } else { this.scrollContDiv.scrollLeft -= this.space }; this.accountPageIndex() }; this.leftEnd = function () { if (_state != "floating") { return }; _state = "stoping"; clearInterval(_scrollTimeObj); var fill = this.pageWidth - this.scrollContDiv.scrollLeft % this.pageWidth; this.move(fill) }; this.rightEnd = function () { if (_state != "floating") { return }; _state = "stoping"; clearInterval(_scrollTimeObj); var fill = -this.scrollContDiv.scrollLeft % this.pageWidth; this.move(fill) }; this.move = function (num, quick) { var thisMove = num / 5; if (!quick) { if (thisMove > this.space) { thisMove = this.space }; if (thisMove < -this.space) { thisMove = -this.space } }; if (Math.abs(thisMove) < 1 && thisMove != 0) { thisMove = thisMove >= 0 ? 1 : -1 } else { thisMove = Math.round(thisMove) }; var temp = this.scrollContDiv.scrollLeft + thisMove; if (thisMove > 0) { if (this.scrollContDiv.scrollLeft + thisMove >= this.listDiv01.scrollWidth) { this.scrollContDiv.scrollLeft = this.scrollContDiv.scrollLeft + thisMove - this.listDiv01.scrollWidth } else { this.scrollContDiv.scrollLeft += thisMove } } else { if (this.scrollContDiv.scrollLeft - thisMove <= 0) { this.scrollContDiv.scrollLeft = this.listDiv01.scrollWidth + this.scrollContDiv.scrollLeft - thisMove } else { this.scrollContDiv.scrollLeft += thisMove } }; num -= thisMove; if (Math.abs(num) == 0) { _state = "ready"; if (this.autoPlay) { this.play() }; this.accountPageIndex(); return } else { this.accountPageIndex(); setTimeout("ScrollPic.childs[" + this.ID + "].move(" + num + "," + quick + ")", this.speed) } }; this.next = function () { if (_state != "ready") { return }; _state = "stoping"; this.move(this.pageWidth, true) }; this.play = function () { if (!this.autoPlay) { return }; clearInterval(_autoTimeObj); _autoTimeObj = setInterval("ScrollPic.childs[" + this.ID + "].next()", this.autoPlayTime * 1000) }; this.stop = function () { clearInterval(_autoTimeObj) }; this.pageTo = function (num) { if (_state != "ready") { return }; _state = "stoping"; var fill = num * this.frameWidth - this.scrollContDiv.scrollLeft; this.move(fill, true) }; this.accountPageIndex = function () { this.pageIndex = Math.round(this.scrollContDiv.scrollLeft / this.frameWidth); if (this.pageIndex > Math.round(this.listDiv01.offsetWidth / this.frameWidth + 0.4) - 1) { this.pageIndex = 0 }; var i; for (i = 0; i < this.dotObjArr.length; i++) { if (i == this.pageIndex) { this.dotObjArr[i].className = this.dotClassName } else { this.dotObjArr[i].className = this.dotOnClassName } } } }; //--------------------------------常见问题 js-----------------------------------// $(function() { //cache the ticker var ticker = $("#ticker2"); //wrap dt:dd pairs in divs ticker.children().filter("li").each(function() { var dt = $(this), container = $("