|
|
Line 451: |
Line 451: |
| line-height: 24px; | | line-height: 24px; |
| } | | } |
- | | + | #p-logo { |
- | #p-logo { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #top-section { |
- | #top-section { | + | height:0; |
- | height:0;
| + | border:none; |
- | border:none;
| + | } |
- | } | + | #search-controls { |
- | #search-controls { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #content { |
- | #content { | + | position:inherit; |
- | position:inherit;
| + | width:inherit; |
- | width:inherit;
| + | margin:0; |
- | margin:0;
| + | padding:0; |
- | padding:0;
| + | background:inherit; |
- | background:inherit;
| + | color:inherit; |
- | color:inherit;
| + | border:none; |
- | border:none;
| + | line-height:inherit; |
- | line-height:inherit;
| + | z-index:2; |
- | z-index:2;
| + | } |
- | } | + | .firstHeading { |
- | .firstHeading { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #catlinks { |
- | #catlinks { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #footer-box { |
- | #footer-box { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #contentSub { |
- | #contentSub { | + | display:none; |
- | display:none;
| + | } |
- | } | + | #menubar ul li a { |
- | #menubar ul li a { | + | background:none; |
- | background:none;
| + | } |
- | } | + | #bodyContent h1,#bodyContent h2 { |
- | #bodyContent h1,#bodyContent h2 { | + | margin:0; |
- | margin:0;
| + | border:0; |
- | border:0;
| + | } |
- | } | + | .left-menu:hover { |
- | .left-menu:hover { | + | background:none; |
- | background:none;
| + | } |
- | } | + | |
| </style> | | </style> |
| <div class="center"> | | <div class="center"> |
Line 536: |
Line 535: |
| <div class="footer"></div> | | <div class="footer"></div> |
| </div> | | </div> |
- | <script> | + | <script src="http://www.yichengliu.com/code/igem/home.js"></script> |
- | $(function(){
| + | |
- | //菜单项填充
| + | |
- | $('.nav-innerUl').each(function(){
| + | |
- | var currentObj = $(this);
| + | |
- | var objName = currentObj.attr('name');
| + | |
- | currentObj.html('');
| + | |
- | for(var i in menuObj[objName]){
| + | |
- | currentObj.append('<a href="https://2012.igem.org/Team:WHU-China/'+objName+'/?catalog='+i+'"><li class="nav-innerLi">'+menuObj[objName][i].title+'</li></a>');
| + | |
- | }
| + | |
- | currentObj.append('<em class="nav-libg"></em>');
| + | |
- | });
| + | |
- |
| + | |
- | //边栏内容填充
| + | |
- | $('.aside-outerUl').html('');
| + | |
- | for(var i in menuObj.home){
| + | |
- | $('.aside-outerUl').append('<li action="'+i+'" class="aside-outerLi">'+menuObj.home[i].title+'</li>');
| + | |
- | }
| + | |
- |
| + | |
- | //绑定点击事件
| + | |
- | $('ul.aside-outerUl>li').click(function(){
| + | |
- | var action = parseInt($(this).attr('action'));
| + | |
- | history.pushState('','','?catalog='+action);
| + | |
- | var formatHead = '<div id="picSlider"><div class="loading"><img src="loading.gif" /></div><div class="pic"><ul>';
| + | |
- | var formatFoot = '</ul></div></div>';
| + | |
- | var formatBody = '';
| + | |
- | for (value in menuObj.home[action].picArray){
| + | |
- | formatBody += '<li><a href="'+ menuObj.home[action].picArray[value].href +'"><img src="'+ menuObj.home[action].picArray[value].src +'" alt="'+ menuObj.home[action].picArray[value].title +'" text="'+ menuObj.home[action].picArray[value].detail +'" /></a></li>';
| + | |
- | }
| + | |
- | $('.main').html(formatHead + formatBody + formatFoot);
| + | |
- | myFocus.set({
| + | |
- | id : 'picSlider',
| + | |
- | txtHeight : 80,
| + | |
- | time : 4
| + | |
- | });
| + | |
- | });
| + | |
- | var catalogString = (/catalog=([0-9]*)/).exec(document.URL);
| + | |
- | if(catalogString && parseInt(catalogString[1]) < menuObj.home.length){
| + | |
- | $('ul.aside-outerUl>li[action='+catalogString[1]+']').click();
| + | |
- | }else{
| + | |
- | $('ul.aside-outerUl>li:first').click();
| + | |
- | }
| + | |
- | });
| + | |
- | </script>
| + | |
- | <script>
| + | |
- | (function() {
| + | |
- | var $id = function(id) {
| + | |
- | return typeof id === 'string' ? document.getElementById(id) : id
| + | |
- | }, $tag = function(tag, parentNode) {
| + | |
- | return ($id(parentNode) || document).getElementsByTagName(tag)
| + | |
- | }, $tag_ = function(tag, parentNode) {
| + | |
- | return $getChild(tag, parentNode, 'tag')
| + | |
- | }, $class = function(className, parentNode) {
| + | |
- | var doms = $tag('*', parentNode), arr = [];
| + | |
- | for (var i = 0, l = doms.length; i < l; i++) {
| + | |
- | if (hasClass(className, doms[i])) {
| + | |
- | arr.push(doms[i])
| + | |
- | }
| + | |
- | }
| + | |
- | return arr
| + | |
- | }, $class_ = function(className, parentNode) {
| + | |
- | return $getChild(className, parentNode)
| + | |
- | }, $getChild = function(selector, parentNode, type) {
| + | |
- | var arr = [], fn = type === 'tag' ? $tag : $class, doms = fn(selector, parentNode), len = doms.length;
| + | |
- | for (var i = 0; i < len; i++) {
| + | |
- | if (doms[i].parentNode === parentNode)
| + | |
- | arr.push(doms[i]);
| + | |
- | i += fn(selector, doms[i]).length
| + | |
- | }
| + | |
- | return arr
| + | |
- | }, hasClass = function(className, node) {
| + | |
- | return eval('/(^|\\s)' + className + '(\\s|$)/').test(node.className)
| + | |
- | };
| + | |
- | myFocus = function(settings) {
| + | |
- | return new myFocus.constr(settings)
| + | |
- | };
| + | |
- | myFocus.extend = function() {
| + | |
- | var arg = arguments, len = arg.length;
| + | |
- | if (this === myFocus) {
| + | |
- | if (len === 1)
| + | |
- | dest = myFocus, i = 0;
| + | |
- | else
| + | |
- | dest = arg[0], i = 1
| + | |
- | } else {
| + | |
- | dest = this, i = 0
| + | |
- | }
| + | |
- | for (i; i < len; i++) {
| + | |
- | for (var p in arg[i]) {
| + | |
- | dest[p] = arg[i][p]
| + | |
- | }
| + | |
- | }
| + | |
- | return dest
| + | |
- | };
| + | |
- | myFocus.extend({
| + | |
- | defConfig : {
| + | |
- | pattern : 'momo',
| + | |
- | trigger : 'click',
| + | |
- | txtHeight : "default",
| + | |
- | wrap : false,
| + | |
- | auto : true,
| + | |
- | time : 5,
| + | |
- | index : 0,
| + | |
- | loadIMGTimeout : 3,
| + | |
- | delay : 100,
| + | |
- | autoZoom : true,
| + | |
- | __focusConstr__ : true
| + | |
- | },
| + | |
- | constr : function(settings) {
| + | |
- | var e = settings, len = e && e.length;
| + | |
- | if ( e instanceof myFocus.constr)
| + | |
- | return e;
| + | |
- | this.length = 0;
| + | |
- | if (!e || (e.sort && !len) || (e.item && !len)) {
| + | |
- | Array.prototype.push.call(this)
| + | |
- | } else if (e.__focusConstr__) {
| + | |
- | e = $id(e.id);
| + | |
- | Array.prototype.push.call(this, e);
| + | |
- | this.settings = settings;
| + | |
- | this.HTMLUList = $tag('li', $tag('ul', e)[0]);
| + | |
- | this.HTMLUListLength = this.HTMLUList.length
| + | |
- | } else if (len) {
| + | |
- | for (var i = 0; i < len; i++)
| + | |
- | Array.prototype.push.call(this, e[i])
| + | |
- | } else {
| + | |
- | Array.prototype.push.call(this, e)
| + | |
- | }
| + | |
- | return this
| + | |
- | },
| + | |
- | fn : {
| + | |
- | splice : [].splice
| + | |
- | },
| + | |
- | pattern : {},
| + | |
- | config : {
| + | |
- | 'momo' : {
| + | |
- | duration : 400,
| + | |
- | txtHeight : 120
| + | |
- | }
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.constr.prototype = myFocus.fn;
| + | |
- | myFocus.fn.extend = myFocus.pattern.extend = myFocus.config.extend = myFocus.extend;
| + | |
- | myFocus.fn.extend({
| + | |
- | find : function(selector) {
| + | |
- | var parent = this, isChild = false, $ = myFocus;
| + | |
- | var arr = this.parseSelector(selector);
| + | |
- | if (this.length)
| + | |
- | for (var i = 0, len = arr.length; i < len; i++) {
| + | |
- | var dom = [], s = arr[i];
| + | |
- | switch (s.charAt(0)) {
| + | |
- | case '>':
| + | |
- | isChild = true;
| + | |
- | break;
| + | |
- | case '.':
| + | |
- | var cls = s.slice(1);
| + | |
- | var fn = isChild ? $class_ : $class;
| + | |
- | $(parent).each(function() {
| + | |
- | dom = dom.concat(fn(cls, this))
| + | |
- | });
| + | |
- | isChild = false;
| + | |
- | break;
| + | |
- | case '#':
| + | |
- | var id = s.slice(1), e = $id(id);
| + | |
- | if (e)
| + | |
- | dom.push($id(id));
| + | |
- | isChild = false;
| + | |
- | break;
| + | |
- | default:
| + | |
- | var fn = isChild ? $tag_ : $tag, sArr = s.split('.');
| + | |
- | var tag = sArr[0], cls = sArr[1];
| + | |
- | $(parent).each(function() {
| + | |
- | var arr = fn(tag, this);
| + | |
- | for (var i = 0, len = arr.length; i < len; i++) {
| + | |
- | if (cls && !hasClass(cls, arr[i]))
| + | |
- | continue;
| + | |
- | dom.push(arr[i])
| + | |
- | }
| + | |
- | });
| + | |
- | isChild = false
| + | |
- | }
| + | |
- | if (!isChild)
| + | |
- | parent = dom
| + | |
- | }
| + | |
- | return $(parent)
| + | |
- | },
| + | |
- | parent : function() {
| + | |
- | return myFocus(this[0].parentNode)
| + | |
- | },
| + | |
- | html : function(s) {
| + | |
- | if ( typeof s !== 'undefined') {
| + | |
- | this[0].innerHTML = s;
| + | |
- | return this
| + | |
- | } else
| + | |
- | return this[0].innerHTML
| + | |
- | },
| + | |
- | each : function(fn) {
| + | |
- | var doms = this;
| + | |
- | for (var i = 0, len = doms.length; i < len; i++) {
| + | |
- | var flag = fn.call(doms[i], i);
| + | |
- | if (flag === false)
| + | |
- | break;
| + | |
- | if (flag === true)
| + | |
- | continue
| + | |
- | }
| + | |
- | return this
| + | |
- | },
| + | |
- | eq : function(n) {
| + | |
- | return myFocus(this[n])
| + | |
- | },
| + | |
- | parseSelector : function(selector) {
| + | |
- | var chunker = /(([^[\]'"]+)+\]|\\.|([^ >+~,(\[\\]+)+|[>+~])(\s*,\s*)?/g;
| + | |
- | var parts = [], m;
| + | |
- | while (( m = chunker.exec(selector)) !== null) {
| + | |
- | parts.push(m[1])
| + | |
- | }
| + | |
- | return parts
| + | |
- | },
| + | |
- | wrap : function(html) {
| + | |
- | var o = this[0], e = document.createElement('div');
| + | |
- | e.innerHTML = html;
| + | |
- | var wrap = e.firstChild;
| + | |
- | o.parentNode.replaceChild(wrap, o);
| + | |
- | wrap.appendChild(o);
| + | |
- | return this
| + | |
- | },
| + | |
- | addHtml : function(html) {
| + | |
- | var parent = this[0];
| + | |
- | var e = document.createElement('div');
| + | |
- | e.innerHTML = html;
| + | |
- | var dom = e.childNodes[0];
| + | |
- | parent.appendChild(dom);
| + | |
- | return myFocus(dom)
| + | |
- | },
| + | |
- | addList : function(className, type) {
| + | |
- | var li = this.HTMLUList, n = this.HTMLUListLength;
| + | |
- | var strArr = ['<div class="' + className + '"><ul>'];
| + | |
- | for (var i = 0; i < n; i++) {
| + | |
- | var img = $tag('img', li[i])[0], html;
| + | |
- | switch (type) {
| + | |
- | case 'num':
| + | |
- | html = '<a>' + (i + 1) + '</a><b></b>';
| + | |
- | break;
| + | |
- | case 'txt':
| + | |
- | html = img ? li[i].innerHTML.replace(/\<img(.|\n|\r)*?\>/i, img.alt) + '<p>' + img.getAttribute("text") + '</p><b></b>' : '';
| + | |
- | break;
| + | |
- | case 'thumb':
| + | |
- | html = img ? '<a><img src=' + (img.getAttribute("thumb") || img.src) + ' /></a><b></b>' : '';
| + | |
- | break;
| + | |
- | default:
| + | |
- | html = '<a></a><b></b>'
| + | |
- | }
| + | |
- | strArr.push('<li>' + html + '</li>')
| + | |
- | }
| + | |
- | strArr.push('</ul></div>');
| + | |
- | return this.addHtml(strArr.join(''))
| + | |
- | },
| + | |
- | addListNum : function(className) {
| + | |
- | return this.addList(className || 'num', 'num')
| + | |
- | },
| + | |
- | addListTxt : function(className) {
| + | |
- | return this.addList(className || 'txt', 'txt')
| + | |
- | },
| + | |
- | addListThumb : function(className) {
| + | |
- | return this.addList(className || 'thumb', 'thumb')
| + | |
- | },
| + | |
- | remove : function() {
| + | |
- | var o = this[0];
| + | |
- | if (o)
| + | |
- | o.parentNode.removeChild(o)
| + | |
- | },
| + | |
- | repeat : function(n) {
| + | |
- | var n = n || 2, pNode = this[0].parentNode, html = pNode.innerHTML, s = [];
| + | |
- | for (var i = 0; i < n; i++)
| + | |
- | s.push(html);
| + | |
- | pNode.innerHTML = s.join('');
| + | |
- | return myFocus(pNode).find(this[0].nodeName)
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.fn.extend({
| + | |
- | css : function(css) {
| + | |
- | var o = this[0], value, arr = [';'], isIE = myFocus.isIE;
| + | |
- | if (!o)
| + | |
- | return this;
| + | |
- | if ( typeof css === 'string') {
| + | |
- | if (css === 'float')
| + | |
- | css = isIE ? 'styleFloat' : 'cssFloat';
| + | |
- | if (!( value = o.style[css]))
| + | |
- | value = (isIE ? o.currentStyle: getComputedStyle(o, ''))[css];
| + | |
- | if (css === 'opacity' && value === undefined)
| + | |
- | value = 1;
| + | |
- | if (value === 'auto' && (css === 'width' || css === 'height'))
| + | |
- | value = o['offset' + css.replace(/\w/i, function(a) {
| + | |
- | return a.toUpperCase()
| + | |
- | })];
| + | |
- | var numVal = parseFloat(value);
| + | |
- | return isNaN(numVal) ? value : numVal
| + | |
- | } else {
| + | |
- | for (var p in css) {
| + | |
- | if ( typeof css[p] === 'number' && !this.cssNumber[p])
| + | |
- | css[p] += 'px';
| + | |
- | arr.push(p.replace(/([A-Z])/g, '-$1') + ':' + css[p] + ';');
| + | |
- | if (p === 'opacity')
| + | |
- | arr.push('filter:alpha(opacity=' + css[p] * 100 + ')')
| + | |
- | }
| + | |
- | o.style.cssText += arr.join('');
| + | |
- | return this
| + | |
- | }
| + | |
- | },
| + | |
- | setOpacity : function(value) {
| + | |
- | this[0].style.opacity = value, this[0].style.filter = 'alpha(opacity=' + value * 100 + ')'
| + | |
- | },
| + | |
- | setAnimateStyle : function(value, prop, m) {
| + | |
- | this[0].style[prop] = Math[m](value) + 'px'
| + | |
- | },
| + | |
- | addClass : function(className) {
| + | |
- | this[0].className += ' ' + className;
| + | |
- | return this
| + | |
- | },
| + | |
- | removeClass : function(className) {
| + | |
- | var o = this[0], cls = className && o.className, reg = "/\\s*\\b" + className + "\\b/g";
| + | |
- | o.className = cls ? cls.replace(eval(reg), '') : '';
| + | |
- | return this
| + | |
- | },
| + | |
- | cssNumber : {
| + | |
- | fillOpacity : true,
| + | |
- | fontWeight : true,
| + | |
- | lineHeight : true,
| + | |
- | opacity : true,
| + | |
- | orphans : true,
| + | |
- | widows : true,
| + | |
- | zIndex : true,
| + | |
- | zoom : true
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.fn.extend({
| + | |
- | animate : function(attr, value, time, type, funcBefore, funcAfter) {
| + | |
- | var $o = this, o = $o[0], isOpacity = attr === 'opacity', diffValue = false;
| + | |
- | funcBefore && funcBefore.call(o);
| + | |
- | if ( typeof value === 'string') {
| + | |
- | if (/^[+-]=\d+/.test(value))
| + | |
- | value = value.replace('=', ''), diffValue = true;
| + | |
- | value = parseFloat(value)
| + | |
- | }
| + | |
- | var oriVal = $o.css(attr), b = isNaN(oriVal) ? 0 : oriVal, c = diffValue ? value : value - b, d = time, e = this.easing[type], m = c > 0 ? 'ceil' : 'floor', timerId = '__myFocusTimer__' + attr, setProperty = $o[ isOpacity ? 'setOpacity' : 'setAnimateStyle'], origTime = (new Date) * 1;
| + | |
- | o[timerId] && clearInterval(o[timerId]);
| + | |
- | o[timerId] = setInterval(function() {
| + | |
- | var t = (new Date) - origTime;
| + | |
- | if (t <= d) {
| + | |
- | setProperty.call($o, e(t, b, c, d), attr, m)
| + | |
- | } else {
| + | |
- | setProperty.call($o, b + c, attr, m);
| + | |
- | clearInterval(o[timerId]), o[timerId] = null;
| + | |
- | funcAfter && funcAfter.call(o)
| + | |
- | }
| + | |
- | }, 13);
| + | |
- | return this
| + | |
- | },
| + | |
- | fadeIn : function(time, type, fn) {
| + | |
- | if ( typeof time !== 'number')
| + | |
- | fn = time, time = 400;
| + | |
- | if ( typeof type === 'function')
| + | |
- | fn = type, type = '';
| + | |
- | this.animate('opacity', 1, time, type || 'linear', function() {
| + | |
- | myFocus(this).css({
| + | |
- | display : 'block',
| + | |
- | opacity : 0
| + | |
- | })
| + | |
- | }, fn);
| + | |
- | return this
| + | |
- | },
| + | |
- | fadeOut : function(time, type, fn) {
| + | |
- | if ( typeof time !== 'number')
| + | |
- | fn = time, time = 400;
| + | |
- | if ( typeof type === 'function')
| + | |
- | fn = type, type = '';
| + | |
- | this.animate('opacity', 0, time, type || 'linear', null, function() {
| + | |
- | this.style.display = 'none';
| + | |
- | fn && fn.call(this)
| + | |
- | });
| + | |
- | return this
| + | |
- | },
| + | |
- | slide : function(params, time, type, fn) {
| + | |
- | if ( typeof time !== 'number')
| + | |
- | fn = time, time = 800;
| + | |
- | if ( typeof type === 'function')
| + | |
- | fn = type, type = '';
| + | |
- | for (var p in params)
| + | |
- | this.animate(p, params[p], time, type || 'easeOut', null, fn);
| + | |
- | return this
| + | |
- | },
| + | |
- | stop : function() {
| + | |
- | var o = this[0];
| + | |
- | for (var p in o)
| + | |
- | if (p.indexOf('__myFocusTimer__') !== -1)
| + | |
- | o[p] && clearInterval(o[p]);
| + | |
- | return this
| + | |
- | },
| + | |
- | easing : {
| + | |
- | linear : function(t, b, c, d) {
| + | |
- | return c * t / d + b
| + | |
- | },
| + | |
- | swing : function(t, b, c, d) {
| + | |
- | return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b
| + | |
- | },
| + | |
- | easeIn : function(t, b, c, d) {
| + | |
- | return c * (t /= d) * t * t * t + b
| + | |
- | },
| + | |
- | easeOut : function(t, b, c, d) {
| + | |
- | return -c * (( t = t / d - 1) * t * t * t - 1) + b
| + | |
- | },
| + | |
- | easeInOut : function(t, b, c, d) {
| + | |
- | return ((t /= d / 2) < 1) ? (c / 2 * t * t * t * t + b) : (-c / 2 * ((t -= 2) * t * t * t - 2) + b)
| + | |
- | }
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.fn.extend({
| + | |
- | bind : function(type, fn) {
| + | |
- | myFocus.addEvent(this[0], type, fn);
| + | |
- | return this
| + | |
- | },
| + | |
- | play : function(funcLastFrame, funcCurrentFrame, seamless) {
| + | |
- | var this_ = this, p = this_.settings, n = this_.HTMLUListLength, t = p.time * 1000, seamless = seamless || false, float = myFocus(this_.HTMLUList).css('float'), isLevel = float === 'left', direction = isLevel ? 'left' : 'top', distance = isLevel ? p.width : p.height, indexLast = 0, indexCurrent = p.index;
| + | |
- | this_.find('.loading').remove();
| + | |
- | this_.run = function(value) {
| + | |
- | funcLastFrame && funcLastFrame(indexLast, n);
| + | |
- | indexCurrent = typeof value === 'string' ? indexLast + parseInt(value.replace('=', '')) : value;
| + | |
- | if (indexCurrent <= -1) {
| + | |
- | indexCurrent = n - 1;
| + | |
- | if (seamless)
| + | |
- | this_.HTMLUList[0].parentNode.style[direction] = -n * distance + 'px'
| + | |
- | }
| + | |
- | if (indexCurrent >= n) {
| + | |
- | if (!seamless)
| + | |
- | indexCurrent = 0;
| + | |
- | if (indexCurrent >= 2 * n) {
| + | |
- | this_.HTMLUList[0].parentNode.style[direction] = -(n - 1) * distance + 'px';
| + | |
- | indexCurrent = n
| + | |
- | }
| + | |
- | }
| + | |
- | if (seamless && indexLast >= n && indexCurrent < n)
| + | |
- | indexCurrent += n;
| + | |
- | funcCurrentFrame && funcCurrentFrame(indexCurrent, n, indexLast);
| + | |
- | this_.runIndex = indexLast = indexCurrent
| + | |
- | };
| + | |
- | try {
| + | |
- | this_.run(indexCurrent)
| + | |
- | } catch(e) {
| + | |
- | setTimeout(function() {
| + | |
- | this_.run(indexCurrent)
| + | |
- | }, 0)
| + | |
- | };
| + | |
- | if (p.auto && n > 1) {
| + | |
- | this_.runTimer = setInterval(function() {
| + | |
- | this_.run('+=1')
| + | |
- | }, t);
| + | |
- | this_.bind('mouseover', function() {
| + | |
- | clearInterval(this_.runTimer)
| + | |
- | }).bind('mouseout', function() {
| + | |
- | if (!this_.isStop)
| + | |
- | this_.runTimer = setInterval(function() {
| + | |
- | this_.run('+=1')
| + | |
- | }, t)
| + | |
- | })
| + | |
- | }
| + | |
- | this_.find('a').each(function() {
| + | |
- | this.onfocus = function() {
| + | |
- | this.blur()
| + | |
- | }
| + | |
- | })
| + | |
- | },
| + | |
- | bindControl : function($btnList, params) {
| + | |
- | var this_ = this, p = this_.settings, type = p.trigger, delay = p.delay, par = params || {}, tsNum = par.thumbShowNum || p.thumbShowNum;
| + | |
- | var run = function() {
| + | |
- | if (this.index !== this_.runIndex && !par.isRunning) {
| + | |
- | this_.run(this.index);
| + | |
- | return false
| + | |
- | }
| + | |
- | };
| + | |
- | $btnList.each(function(i) {
| + | |
- | this.index = i;
| + | |
- | var o = this, $o = myFocus(o);
| + | |
- | if (type === 'click') {
| + | |
- | $o.bind('mouseover', function() {
| + | |
- | $o.addClass('hover')
| + | |
- | }).bind('mouseout', function() {
| + | |
- | $o.removeClass('hover')
| + | |
- | }).bind('click', run)
| + | |
- | } else if (type === 'mouseover') {
| + | |
- | $o.bind('mouseover', function() {
| + | |
- | if (delay === 0)
| + | |
- | run.call(o);
| + | |
- | else
| + | |
- | $btnList.mouseoverTimer = setTimeout(function() {
| + | |
- | run.call(o)
| + | |
- | }, delay)
| + | |
- | }).bind('mouseout', function() {
| + | |
- | $btnList.mouseoverTimer && clearTimeout($btnList.mouseoverTimer)
| + | |
- | })
| + | |
- | } else {
| + | |
- | alert('myFocus Error Setting(trigger) : \"' + type + '\"');
| + | |
- | return false
| + | |
- | }
| + | |
- | });
| + | |
- | if (tsNum) {
| + | |
- | var float = $btnList.css('float'), isLevel = float === 'left' || float === 'right';
| + | |
- | $btnList.dir = isLevel ? 'left' : 'top';
| + | |
- | $btnList.n = this_.HTMLUListLength;
| + | |
- | $btnList.showNum = tsNum;
| + | |
- | $btnList.showStart = p.index;
| + | |
- | $btnList.showEnd = $btnList.showStart + tsNum - 1;
| + | |
- | $btnList.distance = $btnList.css( isLevel ? 'width' : 'height');
| + | |
- | $btnList.slideBody = $btnList.parent()
| + | |
- | }
| + | |
- | },
| + | |
- | scrollTo : function(i, time) {
| + | |
- | var n = this.n, dir = this.dir, $ul = this.slideBody, css = {};
| + | |
- | if (i >= this.showEnd) {
| + | |
- | this.showEnd = i < n - 1 ? i + 1 : i;
| + | |
- | this.showStart = this.showEnd - this.showNum + 1
| + | |
- | } else if (i <= this.showStart) {
| + | |
- | this.showStart = i > 0 ? i - 1 : 0;
| + | |
- | this.showEnd = this.showStart + this.showNum - 1
| + | |
- | }
| + | |
- | css[dir] = -this.showStart * this.distance;
| + | |
- | $ul.slide(css, time || 500, 'easeOut');
| + | |
- | return this
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.extend({
| + | |
- | set : function(p, callback) {
| + | |
- | var F = this, id = p.id, oStyle = F.initBaseCSS(id);
| + | |
- | p.pattern = p.pattern || F.defConfig.pattern;
| + | |
- | p.__clsName = p.pattern + '_' + id;
| + | |
- | F.addEvent(window, 'load', function() {
| + | |
- | F.onloadWindow = true
| + | |
- | });
| + | |
- | F.loadPattern(p, function() {
| + | |
- | p = F.extend({}, F.defConfig, F.config[p.pattern], p);
| + | |
- | F.getBoxReady(p, function() {
| + | |
- | var $o = F($id(id));
| + | |
- | p.width = p.width || $o.css('width'), p.height = p.height || $o.css('height');
| + | |
- | F.initCSS(p, $o, oStyle);
| + | |
- | F.initHTML($o);
| + | |
- | $o.addClass(p.pattern + ' ' + p.__clsName);
| + | |
- | F.getIMGReady(p, function() {
| + | |
- | if (p.autoZoom)
| + | |
- | F.zoomIMG(p, $o);
| + | |
- | F.pattern[p.pattern](p, F);
| + | |
- | callback && callback()
| + | |
- | })
| + | |
- | })
| + | |
- | })
| + | |
- | },
| + | |
- | onloadWindow : false,
| + | |
- | loadPattern : function(p, callback) {
| + | |
- | myFocus.pattern.extend({
| + | |
- | 'momo' : function(settings, $) {
| + | |
- | var $focus = $(settings);
| + | |
- | var $picList = $focus.find('.pic li');
| + | |
- | var $txtList = $focus.addListTxt().find('li');
| + | |
- | var $numList = $focus.addListNum().find('li');
| + | |
- | var txtH = settings.txtHeight;
| + | |
- | $focus[0].style.height = settings.height + txtH + 'px';
| + | |
- | $focus.play(function(i) {
| + | |
- | $picList[i].style.display = 'none';
| + | |
- | $txtList[i].style.display = 'none';
| + | |
- | $numList[i].className = '';
| + | |
- | }, function(i) {
| + | |
- | $picList.eq(i).fadeIn(settings.duration);
| + | |
- | $txtList[i].style.display = 'block';
| + | |
- | $numList[i].className = 'current';
| + | |
- | });
| + | |
- | $focus.bindControl($numList);
| + | |
- | }
| + | |
- | });
| + | |
- | callback()
| + | |
- | },
| + | |
- | getFilePath : function() {
| + | |
- | var path = '';
| + | |
- | var scripts = $tag("script");
| + | |
- | for (var i = 0, len = scripts.length; i < len; i++) {
| + | |
- | var src = scripts[i].src;
| + | |
- | if (src && /myfocus([\.-].*)?\.js/i.test(src)) {
| + | |
- | path = src;
| + | |
- | break
| + | |
- | }
| + | |
- | };
| + | |
- | return path.slice(0, path.lastIndexOf('/') + 1)
| + | |
- | },
| + | |
- | getBoxReady : function(p, fn) {
| + | |
- | var F = this;
| + | |
- | (function() {
| + | |
- | try {
| + | |
- | if (F.isIE)
| + | |
- | $id(p.id).doScroll();
| + | |
- | else
| + | |
- | $id(p.id).innerHTML
| + | |
- | fn()
| + | |
- | } catch(e) {
| + | |
- | if (!F.onloadWindow)
| + | |
- | setTimeout(arguments.callee, 0)
| + | |
- | }
| + | |
- | })()
| + | |
- | },
| + | |
- | getIMGReady : function(p, callback) {
| + | |
- | var t = p.loadIMGTimeout;
| + | |
- | var box = $id(p.id), img = $tag('img', box), len = img.length, count = 0, done = false;
| + | |
- | if (!t || !len) {
| + | |
- | callback();
| + | |
- | return
| + | |
- | }
| + | |
- | for (var i = 0; i < len; i++) {
| + | |
- | img[i].onload = function() {
| + | |
- | count += 1;
| + | |
- | if (count == len && !done) {
| + | |
- | done = true, callback()
| + | |
- | }
| + | |
- | };
| + | |
- | if (this.isIE)
| + | |
- | img[i].src = img[i].src
| + | |
- | };
| + | |
- | var t = t * 1000;
| + | |
- | setTimeout(function() {
| + | |
- | if (!done) {
| + | |
- | done = true, callback()
| + | |
- | }
| + | |
- | }, t)
| + | |
- | },
| + | |
- | zoomIMG : function(p, $o) {
| + | |
- | var imgs = $tag('img', $tag('ul', $o[0])[0]), len = imgs.length, boxWidth = p.width, boxHeight = p.height;
| + | |
- | for (var i = 0; i < len; i++) {
| + | |
- | var IMG = new Image();
| + | |
- | IMG.src = imgs[i].src;
| + | |
- | if (IMG.width / IMG.height >= boxWidth / boxHeight) {
| + | |
- | imgs[i].style.width = boxWidth + 'px';
| + | |
- | imgs[i].style.marginTop = (boxHeight - boxWidth / IMG.width * IMG.height) / 2 + 'px'
| + | |
- | } else {
| + | |
- | imgs[i].style.height = boxHeight + 'px'
| + | |
- | }
| + | |
- | }
| + | |
- | },
| + | |
- | initCSS : function(p, $o, oStyle) {
| + | |
- | var css = [], w = p.width || '', h = p.height || '';
| + | |
- | if (p.wrap)
| + | |
- | $o.wrap('<div class="' + p.pattern + '_wrap"></div>');
| + | |
- | css.push('.' + p.__clsName + ' *{margin:0;padding:0;border:0;list-style:none;}.' + p.__clsName + '{position:relative;width:' + w + 'px;height:' + h + 'px;overflow:hidden;font:12px/1.5 Verdana;text-align:left;background:#fff;visibility:visible!important;}.' + p.__clsName + ' .loading{position:absolute;z-index:9999;width:100%;height:100%;color:#666;text-align:center;padding-top:' + 0.26 * h + 'px;background:#fff;}.' + p.__clsName + ' .pic{position:relative;width:' + w + 'px;height:' + h + 'px;overflow:hidden;}.' + p.__clsName + ' .txt li{width:' + w + 'px;height:' + p.txtHeight + 'px!important;overflow:hidden;}');
| + | |
- | if (p.autoZoom)
| + | |
- | css.push('.' + p.__clsName + ' .pic li{text-align:center;width:' + w + 'px;height:' + h + 'px;}');
| + | |
- | try {
| + | |
- | oStyle.styleSheet.cssText = css.join('')
| + | |
- | } catch(e) {
| + | |
- | oStyle.innerHTML = css.join('')
| + | |
- | }
| + | |
- | },
| + | |
- | initBaseCSS : function(id) {
| + | |
- | var s = '#' + id + ' *{display:none}', oStyle = document.createElement('style');
| + | |
- | oStyle.type = 'text/css';
| + | |
- | try {
| + | |
- | oStyle.styleSheet.cssText = s
| + | |
- | } catch(e) {
| + | |
- | oStyle.innerHTML = s
| + | |
- | }
| + | |
- | var oHead = $tag('head', document)[0];
| + | |
- | oHead.insertBefore(oStyle, oHead.firstChild);
| + | |
- | return oStyle
| + | |
- | },
| + | |
- | initHTML : function($o) {
| + | |
- | var $load = $o.find('.loading'), $img = $load.find('img'), img = $img[0];
| + | |
- | if ($img.length) {
| + | |
- | $load.addHtml('<p>' + img.alt + '</p>');
| + | |
- | if (!img.getAttribute('src'))
| + | |
- | img.style.display = 'none'
| + | |
- | }
| + | |
- | }
| + | |
- | });
| + | |
- | myFocus.extend({
| + | |
- | isIE : !!(document.all && navigator.userAgent.indexOf('Opera') === -1),
| + | |
- | addEvent : function(o, type, fn) {
| + | |
- | var ie = this.isIE, e = ie ? 'attachEvent' : 'addEventListener', t = ( ie ? 'on' : '') + type;
| + | |
- | o[e](t, function(e) {
| + | |
- | var e = e || window.event, flag = fn.call(o, e);
| + | |
- | if (flag === false) {
| + | |
- | if (ie)
| + | |
- | e.cancelBubble = true, e.returnValue = false;
| + | |
- | else
| + | |
- | e.stopPropagation(), e.preventDefault()
| + | |
- | }
| + | |
- | }, false)
| + | |
- | }
| + | |
- | });
| + | |
- | if ( typeof jQuery !== 'undefined') {
| + | |
- | jQuery.fn.extend({
| + | |
- | myFocus : function(p, fn) {
| + | |
- | if (!p)
| + | |
- | p = {};
| + | |
- | p.id = this[0].id;
| + | |
- | if (!p.id)
| + | |
- | p.id = this[0].id = 'mF__ID__';
| + | |
- | myFocus.set(p, fn)
| + | |
- | }
| + | |
- | })
| + | |
- | }
| + | |
- | })();
| + | |
- | $(function(){
| + | |
- | $('li.nav-outerLi').hover(function(){
| + | |
- | $(this).find('ul.nav-innerUl').slideDown(300);
| + | |
- | },function(){
| + | |
- | $(this).find('ul.nav-innerUl').slideUp(300);
| + | |
- | });
| + | |
- | //$('#bodyContent').children('p:first').hide();
| + | |
- | $('#bodyContent').click(function{
| + | |
- | alert();
| + | |
- | });
| + | |
- | });
| + | |
- | </script>
| + | |
| </body> | | </body> |
| </html> | | </html> |