|
|
(150 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | {{Team:BNU-China/CSS/main}} | + | {{Team:BNU-China/CSS/bootstrap.min.css}} |
| + | {{Team:BNU-China/CSS/main_new.css}} |
| <html> | | <html> |
| <head> | | <head> |
- | <meta charset="UTF-8"> | + | <meta name="description" content="BNU-China, 2014,igem"> |
- | <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.prettyPhoto.js?action=raw"></script> | + | <meta name="keywords" content="BNU,BNU-China,igem,ModA,chemotaxis,peanut"> |
- | <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.jcarousel.js?action=raw"></script> | + | <meta name="author" content="刘兵LiuBing"> |
- | <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery.prettyPhoto.js?action=raw"></script> | + | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
- | | + | <link rel="shortcut icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" type="image/x-icon" /> |
- | <!--ddsmoothmenu--> | + | <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png"sizes="32x32" /> |
- | <script type="text/javascript">
| + | <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" sizes="64x64" /> |
- | var ddsmoothmenu={ | + | <link rel="icon" href="https://static.igem.org/mediawiki/2014/6/6a/Bnu_bktn2.png" sizes="128x128" /> |
- | arrowimages: {down:[], right:[]},
| + | <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/jquery-1.10.2.min.js?action=raw"></script> |
- | transition: {overtime:300, outtime:300},
| + | <script type="text/javascript" src="https://2014.igem.org/Team:BNU-China/js/bootstrap.min.js?action=raw"></script> |
- | shadow: {enable:false, offsetx:5, offsety:5},
| + | <script> |
- | showhidedelay: {showdelay: 100, hidedelay: 200},
| + | //var loginFlag = false; |
- | detectwebkit: navigator.userAgent.toLowerCase().indexOf("applewebkit")!=-1,
| + | //var loginHelper = null; |
- | detectie6: document.all && !window.XMLHttpRequest,
| + | $(document).ready(function(){ |
- | | + | $('.carousel').carousel( |
- | getajaxmenu:function($, setting){
| + | { |
- | var $menucontainer=$('#'+setting.contentsource[0]) | + | "pause":"false", |
- | $menucontainer.html("Loading Menu...") | + | "interval":5000 |
- | $.ajax({
| + | |
- | url: setting.contentsource[1],
| + | |
- | async: true,
| + | |
- | error:function(ajaxrequest){
| + | |
- | $menucontainer.html('Error fetching content. Server Response: '+ajaxrequest.responseText)
| + | |
- | },
| + | |
- | success:function(content){
| + | |
- | $menucontainer.html(content)
| + | |
- | ddsmoothmenu.buildmenu($, setting) | + | |
- | }
| + | |
- | })
| + | |
- | },
| + | |
- | buildmenu:function($, setting){
| + | |
- | var smoothmenu=ddsmoothmenu
| + | |
- | var $mainmenu=$("#"+setting.mainmenuid+">ul")
| + | |
- | $mainmenu.parent().get(0).className=setting.classname || "ddsmoothmenu"
| + | |
- | var $headers=$mainmenu.find("ul").parent()
| + | |
- | $headers.hover(
| + | |
- | function(e){
| + | |
- | $(this).children('a:eq(0)').addClass('selected')
| + | |
- | },
| + | |
- | function(e){
| + | |
- | $(this).children('a:eq(0)').removeClass('selected')
| + | |
- | }
| + | |
- | )
| + | |
- | $headers.each(function(i){
| + | |
- | var $curobj=$(this).css({zIndex: 100-i})
| + | |
- | var $subul=$(this).find('ul:eq(0)').css({display:'block'})
| + | |
- | $subul.data('timers', {})
| + | |
- | this._dimensions={w:this.offsetWidth, h:this.offsetHeight, subulw:$subul.outerWidth(), subulh:$subul.outerHeight()}
| + | |
- | this.istopheader=$curobj.parents("ul").length==1? true : false
| + | |
- | $subul.css({top:this.istopheader && setting.orientation!='v'? this._dimensions.h+"px" : 0})
| + | |
- | $curobj.children("a:eq(0)").css(this.istopheader? {paddingRight: smoothmenu.arrowimages.down[2]} : {})
| + | |
- | if (smoothmenu.shadow.enable){
| + | |
- | this._shadowoffset={x:(this.istopheader?$subul.offset().left+smoothmenu.shadow.offsetx : this._dimensions.w), y:(this.istopheader? $subul.offset().top+smoothmenu.shadow.offsety : $curobj.position().top)}
| + | |
- | if (this.istopheader)
| + | |
- | $parentshadow=$(document.body) | + | |
- | else{
| + | |
- | var $parentLi=$curobj.parents("li:eq(0)")
| + | |
- | $parentshadow=$parentLi.get(0).$shadow
| + | |
| } | | } |
- | this.$shadow=$('<div class="ddshadow'+(this.istopheader? ' toplevelshadow' : '')+'"></div>').prependTo($parentshadow).css({left:this._shadowoffset.x+'px', top:this._shadowoffset.y+'px'})
| + | ); |
- | }
| + | |
- | $curobj.hover(
| + | |
- | function(e){
| + | |
- | var $targetul=$subul
| + | |
- | var header=$curobj.get(0)
| + | |
- | clearTimeout($targetul.data('timers').hidetimer)
| + | |
- | $targetul.data('timers').showtimer=setTimeout(function(){
| + | |
- | header._offsets={left:$curobj.offset().left, top:$curobj.offset().top}
| + | |
- | var menuleft=header.istopheader && setting.orientation!='v'? 0 : header._dimensions.w
| + | |
- | menuleft=(header._offsets.left+menuleft+header._dimensions.subulw>$(window).width())? (header.istopheader && setting.orientation!='v'? -header._dimensions.subulw+header._dimensions.w : -header._dimensions.w) : menuleft
| + | |
- | if ($targetul.queue().length<=1){
| + | |
- | $targetul.css({left:menuleft+"px", width:header._dimensions.subulw+'px'}).animate({height:'show',opacity:'show'}, ddsmoothmenu.transition.overtime)
| + | |
- | if (smoothmenu.shadow.enable){
| + | |
- | var shadowleft=header.istopheader? $targetul.offset().left+ddsmoothmenu.shadow.offsetx : menuleft
| + | |
- | var shadowtop=header.istopheader?$targetul.offset().top+smoothmenu.shadow.offsety : header._shadowoffset.y
| + | |
- | if (!header.istopheader && ddsmoothmenu.detectwebkit){
| + | |
- | header.$shadow.css({opacity:1})
| + | |
- | }
| + | |
- | header.$shadow.css({overflow:'', width:header._dimensions.subulw+'px', left:shadowleft+'px', top:shadowtop+'px'}).animate({height:header._dimensions.subulh+'px'}, ddsmoothmenu.transition.overtime)
| + | |
- | }
| + | |
- | }
| + | |
- | }, ddsmoothmenu.showhidedelay.showdelay)
| + | |
- | },
| + | |
- | function(e){
| + | |
- | var $targetul=$subul
| + | |
- | var header=$curobj.get(0)
| + | |
- | clearTimeout($targetul.data('timers').showtimer)
| + | |
- | $targetul.data('timers').hidetimer=setTimeout(function(){
| + | |
- | $targetul.animate({height:'hide', opacity:'hide'}, ddsmoothmenu.transition.outtime)
| + | |
- | if (smoothmenu.shadow.enable){
| + | |
- | if (ddsmoothmenu.detectwebkit){
| + | |
- | header.$shadow.children('div:eq(0)').css({opacity:0})
| + | |
- | }
| + | |
- | header.$shadow.css({overflow:'hidden'}).animate({height:0}, ddsmoothmenu.transition.outtime)
| + | |
- | }
| + | |
- | }, ddsmoothmenu.showhidedelay.hidedelay)
| + | |
- | }
| + | |
- | )
| + | |
- | })
| + | |
- | $mainmenu.find("ul").css({display:'none', visibility:'visible'})
| + | |
- | },
| + | |
- | | + | |
- | init:function(setting){
| + | |
- | if (typeof setting.customtheme=="object" && setting.customtheme.length==2){
| + | |
- | var mainmenuid='#'+setting.mainmenuid
| + | |
- | var mainselector=(setting.orientation=="v")? mainmenuid : mainmenuid+', '+mainmenuid
| + | |
- | document.write('<style type="text/css">\n'
| + | |
- | +mainselector+' ul li a {background:'+setting.customtheme[0]+';}\n'
| + | |
- | +mainmenuid+' ul li a:hover {background:'+setting.customtheme[1]+';}\n'
| + | |
- | +'</style>')
| + | |
- | }
| + | |
- | this.shadow.enable=(document.all && !window.XMLHttpRequest)? false : this.shadow.enable
| + | |
- | jQuery(document).ready(function($){
| + | |
- | if (typeof setting.contentsource=="object"){
| + | |
- | ddsmoothmenu.getajaxmenu($, setting)
| + | |
- | }
| + | |
- | else{
| + | |
- | ddsmoothmenu.buildmenu($, setting)
| + | |
- | }
| + | |
- | })
| + | |
- | }
| + | |
- | | + | |
- | }
| + | |
- | | + | |
- | | + | |
- | </script>
| + | |
- | | + | |
- | <!--jquery.superbgimage.min-->
| + | |
- | <script type="text/javascript">
| + | |
- | (function($){jQuery.fn.superbgimage=function(loadingoptions){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options,loadingoptions);$.superbg_inAnimation=false;$.superbg_slideshowActive=false;$.superbg_imgIndex=1;$.superbg_imgActual=1;$.superbg_imgLast=-1;$.superbg_imgSlide=0;$.superbg_interval=0;$.superbg_preload=0;$.superbg_direction=0;$.superbg_max_randomtrans=7;$.superbg_lasttrans=-1;$.superbg_isIE6=false;$.superbg_firstLoaded=false;$.superbg_saveId=$(this).attr('id');if($('#'+options.id).length===0){$('body').prepend('<div id="'+options.id+'" style="display:none;"></div>');}else{$('body').prepend($('#'+options.id));}$('#'+options.id).css('display','none').css('overflow','hidden').css('z-index',options.z_index);if(options.inlineMode===0){$('#'+options.id).css('position','fixed').css('width','100%').css('height','100%').css('top',0).css('left',0);}if(options.reload){$('#'+options.id+' img').remove();}$('#'+options.id+' img').hide().css('position','absolute');$('#'+options.id).children('img').each(function(){$(this).attr('rel',$.superbg_imgIndex++);if(!options.showtitle){$(this).attr('title','');}});$(this).children('a').each(function(){$(this).attr('rel',$.superbg_imgIndex++).click(function(){$(this).superbgShowImage();return false;}).addClass('preload');});$.superbg_imgIndex--;$(window).bind('load',function(){$(this).superbgLoad();});$(window).bind('resize',function(){$(this).superbgResize();});$.superbg_isIE6=/msie|MSIE 6/.test(navigator.userAgent);if($.superbg_isIE6&&(options.inlineMode===0)){$('#'+options.id).css('position','absolute').width($(window).width()).height($(window).height());$(window).bind('scroll',function(){$(this).superbgScrollIE6();});}if(options.reload){$(this).superbgLoad();}return this;};jQuery.fn.superbgScrollIE6=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);$('#'+options.id).css('top',document.documentElement.scrollTop+'px');};jQuery.fn.superbgLoad=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);if(($('#'+options.id).children('img').length>0)||($('#'+$.superbg_saveId).children('a').length>0)){$('#'+options.id).show();}if((typeof options.showimage!='undefined')&&(options.showimage>=0)){$.superbg_imgActual=options.showimage;}if(options.randomimage===1){$.superbg_imgActual=(1+parseInt(Math.random()*($.superbg_imgIndex-1+1),10));}$(this).superbgShowImage($.superbg_imgActual);};jQuery.fn.superbgimagePreload=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);clearInterval($.superbg_preload);if(!$.superbg_firstLoaded&&($('#'+$.superbg_saveId).children('a').length>0)){$.superbg_preload=setInterval("$(this).superbgimagePreload()",111);return;}$('#'+$.superbg_saveId).children('a.preload:first').each(function(){var imgrel=$(this).attr('rel');var imgtitle=$(this).attr('title');var img=new Image();$(img).load(function(){$(this).css('position','absolute').hide();if($('#'+options.id).children('img'+"[rel='"+imgrel+"']").length===0){$(this).attr('rel',imgrel);if(options.showtitle===1){$(this).attr('title',imgtitle);}$('#'+options.id).prepend(this);}img.onload=function(){};}).error(function(){img.onerror=function(){};}).attr('src',$(this).attr('href'));$.superbg_preload=setInterval("$(this).superbgimagePreload()",111);}).removeClass('preload');};jQuery.fn.startSlideShow=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);$.superbg_imgSlide=$.superbg_imgActual;if($.superbg_interval!==0){clearInterval($.superbg_interval);}$.superbg_interval=setInterval("$(this).nextSlide()",options.slide_interval);$.superbg_slideshowActive=true;return false;};jQuery.fn.stopSlideShow=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);clearInterval($.superbg_interval);$.superbg_slideshowActive=false;return false;};jQuery.fn.nextSlide=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);if($.superbg_inAnimation)return false;if($.superbg_slideshowActive){clearInterval($.superbg_preload);}$.superbg_direction=0;$.superbg_imgSlide++;if($.superbg_imgSlide>$.superbg_imgIndex){$.superbg_imgSlide=1;}if(options.randomimage===1){$.superbg_imgSlide=(1+parseInt(Math.random()*($.superbg_imgIndex-1+1),10));while($.superbg_imgSlide===$.superbg_imgLast){$.superbg_imgSlide=(1+parseInt(Math.random()*($.superbg_imgIndex-1+1),10));}}$.superbg_imgActual=$.superbg_imgSlide;return $(this).superbgShowImage($.superbg_imgActual);};jQuery.fn.prevSlide=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);if($.superbg_inAnimation)return false;$.superbg_direction=1;$.superbg_imgSlide--;if($.superbg_imgSlide<1){$.superbg_imgSlide=$.superbg_imgIndex;}if(options.randomimage===1){$.superbg_imgSlide=(1+parseInt(Math.random()*($.superbg_imgIndex-1+1),10));while($.superbg_imgSlide===$.superbg_imgLast){$.superbg_imgSlide=(1+parseInt(Math.random()*($.superbg_imgIndex-1+1),10));}}$.superbg_imgActual=$.superbg_imgSlide;return $(this).superbgShowImage($.superbg_imgActual);};jQuery.fn.superbgResize=function(){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);var thisimg=$('#'+options.id+' img.activeslide');var dimensions=$(this).superbgCalcSize($(thisimg).width(),$(thisimg).height());var newwidth=dimensions[0];var newheight=dimensions[1];var newleft=dimensions[2];var newtop=dimensions[3];$(thisimg).css('width',newwidth+'px');$(thisimg).css('height',newheight+'px');if($.superbg_isIE6&&(options.inlineMode===0)){$('#'+options.id).width(newwidth).height(newheight);$(thisimg).width(newwidth);$(thisimg).height(newheight);}$(thisimg).css('left',newleft+'px');if(options.vertical_center===1){$(thisimg).css('top',newtop+'px');}else{$(thisimg).css('top','0px');}};jQuery.fn.superbgCalcSize=function(imgw,imgh){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);var browserwidth=$(window).width();var browserheight=$(window).height();if(options.inlineMode===1){browserwidth=$('#'+options.id).width();browserheight=$('#'+options.id).height();}var ratio=imgh/imgw;var newheight=0;var newwidth=0;if((browserheight/browserwidth)>ratio){newheight=browserheight;newwidth=Math.round(browserheight/ratio);}else{newheight=Math.round(browserwidth*ratio);newwidth=browserwidth;}var newleft=Math.round((browserwidth-newwidth)/2);var newtop=Math.round((browserheight-newheight)/2);var rcarr=[newwidth,newheight,newleft,newtop];return rcarr;};jQuery.fn.superbgShowImage=function(img){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);$.superbg_imgActual=$(this).attr('rel');if(typeof img!=='undefined'){$.superbg_imgActual=img;}if($('#'+options.id+' img.activeslide').attr('rel')===$.superbg_imgActual){return false;}if($.superbg_inAnimation){return false;}else{$.superbg_inAnimation=true;}var imgsrc='';var imgtitle='';if($('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']").length===0){imgsrc=$('#'+$.superbg_saveId+' a'+"[rel='"+$.superbg_imgActual+"']").attr('href');imgtitle=$('#'+$.superbg_saveId+' a'+"[rel='"+$.superbg_imgActual+"']").attr('title');}else{imgsrc=$('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']").attr('src');}if((typeof options.onHide==='function')&&(options.onHide!==null)&&($.superbg_imgLast>=0)){options.onHide($.superbg_imgLast);}$('#'+options.id+' img.activeslide').superbgLoadImage(imgsrc,imgtitle);$('#'+$.superbg_saveId+' a').removeClass('activeslide');$('#'+$.superbg_saveId).children('a'+"[rel='"+$.superbg_imgActual+"']").addClass('activeslide');$.superbg_imgSlide=$.superbg_imgActual;$.superbg_imgLast=$.superbg_imgActual;return false;};jQuery.fn.superbgLoadImage=function(imgsrc,imgtitle){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);if($('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']").length===0){var img=new Image();$(img).load(function(){$(this).css('position','absolute').hide();if($('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']").length===0){$(this).attr('rel',$.superbg_imgActual);if(options.showtitle===1){$(this).attr('title',imgtitle);}$('#'+options.id).prepend(this);}var thisimg=$('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']");var dimensions=$(this).superbgCalcSize(img.width,img.height);$(this).superbgTransition(thisimg,dimensions);if(!$.superbg_firstLoaded){if(options.slideshow===1){$(this).startSlideShow();}if((options.preload===1)&&($('#'+$.superbg_saveId).children('a').length>0)){$.superbg_preload=setInterval("$(this).superbgimagePreload()",250);}}$.superbg_firstLoaded=true;img.onload=function(){};}).error(function(){$.superbg_inAnimation=false;img.onerror=function(){};}).attr('src',imgsrc);}else{var thisimg=$('#'+options.id).children('img'+"[rel='"+$.superbg_imgActual+"']");var dimensions=$(this).superbgCalcSize($(thisimg).width(),$(thisimg).height());$(this).superbgTransition(thisimg,dimensions);if(!$.superbg_firstLoaded){if(options.slideshow===1){$(this).startSlideShow();}if((options.preload===1)&&($('#'+$.superbg_saveId).children('a').length>0)){$.superbg_preload=setInterval("$(this).superbgimagePreload()",250);}$.superbg_firstLoaded=true;}}};jQuery.fn.superbgTransition=function(thisimg,dimensions){var options=$.extend($.fn.superbgimage.defaults,$.fn.superbgimage.options);var newwidth=dimensions[0];var newheight=dimensions[1];var newleft=dimensions[2];var newtop=dimensions[3];$(thisimg).css('width',newwidth+'px').css('height',newheight+'px').css('left',newleft+'px');if((typeof options.onClick==='function')&&(options.onClick!==null)){$(thisimg).unbind('click').click(function(){options.onClick($.superbg_imgActual);});}if((typeof options.onMouseenter==='function')&&(options.onMouseenter!==null)){$(thisimg).unbind('mouseenter').mouseenter(function(){options.onMouseenter($.superbg_imgActual);});}if((typeof options.onMouseleave==='function')&&(options.onMouseleave!==null)){$(thisimg).unbind('mouseleave').mouseleave(function(){options.onMouseleave($.superbg_imgActual);});}if((typeof options.onMousemove==='function')&&(options.onMousemove!==null)){$(thisimg).unbind('mousemove').mousemove(function(e){options.onMousemove($.superbg_imgActual,e);});}if(options.randomtransition===1){var randomtrans=(0+parseInt(Math.random()*($.superbg_max_randomtrans-0+1),10));while(randomtrans===$.superbg_lasttrans){randomtrans=(0+parseInt(Math.random()*($.superbg_max_randomtrans-0+1),10));}options.transition=randomtrans;}if(options.vertical_center===1){$(thisimg).css('top',newtop+'px');}else{$(thisimg).css('top','0px');}var akt_transitionout=options.transitionout;if((options.transition===6)||(options.transition===7)){akt_transitionout=0;}if(akt_transitionout===1){$('#'+options.id+' img.activeslide').removeClass('activeslide').addClass('lastslide').css('z-index',0);}else{$('#'+options.id+' img.activeslide').removeClass('activeslide').addClass('lastslideno').css('z-index',0);}$(thisimg).css('z-index',1);options.transition=parseInt(options.transition,10);$.superbg_lasttrans=options.transition;var theEffect='';var theDir='';if(options.transition===0){$(thisimg).show(1,function(){if((typeof options.onShow==='function')&&(options.onShow!==null))options.onShow($.superbg_imgActual);$.superbg_inAnimation=false;if($.superbg_slideshowActive){$('#'+options.id).startSlideShow();}}).addClass('activeslide');}else if(options.transition===1){$(thisimg).fadeIn(options.speed,function(){if((typeof options.onShow==='function')&&(options.onShow!==null))options.onShow($.superbg_imgActual);$('#'+options.id+' img.lastslideno').hide(1,null).removeClass('lastslideno');$.superbg_inAnimation=false;if($.superbg_slideshowActive){$('#'+options.id).startSlideShow();}}).addClass('activeslide');}else{if(options.transition===2){theEffect='slide';theDir='up';}if(options.transition===3){theEffect='slide';theDir='right';}if(options.transition===4){theEffect='slide';theDir='down';}if(options.transition===5){theEffect='slide';theDir='left';}if(options.transition===6){theEffect='blind';theDir='horizontal';}if(options.transition===7){theEffect='blind';theDir='vertical';}if(options.transition===90){theEffect='slide';theDir='left';if($.superbg_direction===1){theDir='right';}}if(options.transition===91){theEffect='slide';theDir='down';if($.superbg_direction===1){theDir='up';}}$(thisimg).show(theEffect,{direction:theDir},options.speed,function(){if((typeof options.onShow==='function')&&(options.onShow!==null))options.onShow($.superbg_imgActual);$('#'+options.id+' img.lastslideno').hide(1,null).removeClass('lastslideno');$.superbg_inAnimation=false;if($.superbg_slideshowActive){$('#'+options.id).startSlideShow();}}).addClass('activeslide');}if(akt_transitionout===1){var outspeed=options.speed;if(options.speed=='slow'){outspeed=600+200;}else if(options.speed=='normal'){outspeed=400+200;}else if(options.speed=='fast'){outspeed=400+200;}else{outspeed=options.speed+200;}if(options.transition===0){$('#'+options.id+' img.lastslide').hide(1,null).removeClass('lastslide');}else if(options.transition==1){$('#'+options.id+' img.lastslide').fadeOut(outspeed).removeClass('lastslide');}else{if(options.transition===2){theEffect='slide';theDir='down';}if(options.transition===3){theEffect='slide';theDir='left';}if(options.transition===4){theEffect='slide';theDir='up';}if(options.transition===5){theEffect='slide';theDir='right';}if(options.transition===6){theEffect='';theDir='';}if(options.transition===7){theEffect='';theDir='';}if(options.transition===90){theEffect='slide';theDir='right';if($.superbg_direction===1){theDir='left';}}if(options.transition===91){theEffect='slide';theDir='up';if($.superbg_direction===1){theDir='down';}}$('#'+options.id+' img.lastslide').hide(theEffect,{direction:theDir},outspeed).removeClass('lastslide');}}else{$('#'+options.id+' img.lastslide').hide(1,null).removeClass('lastslide');}};jQuery.fn.superbgimage.defaults={id:'superbgimage',z_index:0,inlineMode:0,showimage:1,vertical_center:1,transition:1,transitionout:1,randomtransition:0,showtitle:0,slideshow:0,slide_interval:5000,randomimage:0,speed:'slow',preload:1,onShow:null,onClick:null,onHide:null,onMouseenter:null,onMouseleave:null,onMousemove:null};})(jQuery);
| + | |
- | </script>
| + | |
- | | + | |
- | <!--jQuery Masonry -->
| + | |
- | <script type="text/javascript">
| + | |
- | | + | |
- | (function(e){var n=e.event,o;n.special.smartresize={setup:function(){e(this).bind("resize",n.special.smartresize.handler)},teardown:function(){e(this).unbind("resize",n.special.smartresize.handler)},handler:function(j,l){var g=this,d=arguments;j.type="smartresize";o&&clearTimeout(o);o=setTimeout(function(){jQuery.event.handle.apply(g,d)},l==="execAsap"?0:100)}};e.fn.smartresize=function(j){return j?this.bind("smartresize",j):this.trigger("smartresize",["execAsap"])};e.fn.masonry=function(j,l){var g=
| + | |
- | {getBricks:function(d,b,a){var c=a.itemSelector===undefined;b.$bricks=a.appendedContent===undefined?c?d.children():d.find(a.itemSelector):c?a.appendedContent:a.appendedContent.filter(a.itemSelector)},placeBrick:function(d,b,a,c,h){b=Math.min.apply(Math,a);for(var i=b+d.outerHeight(true),f=a.length,k=f,m=c.colCount+1-f;f--;)if(a[f]==b)k=f;d.applyStyle({left:c.colW*k+c.posLeft,top:b},e.extend(true,{},h.animationOptions));for(f=0;f<m;f++)c.colY[k+f]=i},setup:function(d,b,a){g.getBricks(d,a,b);if(a.masoned)a.previousData=
| + | |
- | d.data("masonry");a.colW=b.columnWidth===undefined?a.masoned?a.previousData.colW:a.$bricks.outerWidth(true):b.columnWidth;a.colCount=Math.floor(d.width()/a.colW);a.colCount=Math.max(a.colCount,1)},arrange:function(d,b,a){var c;if(!a.masoned||b.appendedContent!==undefined)a.$bricks.css("position","absolute");if(a.masoned){a.posTop=a.previousData.posTop;a.posLeft=a.previousData.posLeft}else{d.css("position","relative");var h=e(document.createElement("div"));d.prepend(h);a.posTop=Math.round(h.position().top);
| + | |
- | a.posLeft=Math.round(h.position().left);h.remove()}if(a.masoned&&b.appendedContent!==undefined){a.colY=a.previousData.colY;for(c=a.previousData.colCount;c<a.colCount;c++)a.colY[c]=a.posTop}else{a.colY=[];for(c=a.colCount;c--;)a.colY.push(a.posTop)}e.fn.applyStyle=a.masoned&&b.animate?e.fn.animate:e.fn.css;b.singleMode?a.$bricks.each(function(){var i=e(this);g.placeBrick(i,a.colCount,a.colY,a,b)}):a.$bricks.each(function(){var i=e(this),f=Math.ceil(i.outerWidth(true)/a.colW);f=Math.min(f,a.colCount);
| + | |
- | if(f===1)g.placeBrick(i,a.colCount,a.colY,a,b);else{var k=a.colCount+1-f,m=[];for(c=0;c<k;c++){var p=a.colY.slice(c,c+f);m[c]=Math.max.apply(Math,p)}g.placeBrick(i,k,m,a,b)}});a.wallH=Math.max.apply(Math,a.colY);d.applyStyle({height:a.wallH-a.posTop},e.extend(true,[],b.animationOptions));a.masoned||setTimeout(function(){d.addClass("masoned")},1);l.call(a.$bricks);d.data("masonry",a)},resize:function(d,b,a){a.masoned=!!d.data("masonry");var c=d.data("masonry").colCount;g.setup(d,b,a);a.colCount!=c&&
| + | |
- | g.arrange(d,b,a)}};return this.each(function(){var d=e(this),b={};b.masoned=!!d.data("masonry");var a=b.masoned?d.data("masonry").options:{},c=e.extend({},e.fn.masonry.defaults,a,j),h=a.resizeable;b.options=c.saveOptions?c:a;l=l||function(){};g.getBricks(d,b,c);if(!b.$bricks.length)return this;g.setup(d,c,b);g.arrange(d,c,b);!h&&c.resizeable&&e(window).bind("smartresize.masonry",function(){g.resize(d,c,b)});h&&!c.resizeable&&e(window).unbind("smartresize.masonry")})};e.fn.masonry.defaults={singleMode:false,
| + | |
- | columnWidth:undefined,itemSelector:undefined,appendedContent:undefined,saveOptions:true,resizeable:true,animate:false,animationOptions:{}}})(jQuery);
| + | |
- | </script>
| + | |
- | | + | |
- | | + | |
- | <!--jQuery Slick Forms-->
| + | |
- | <script type="text/javascript">
| + | |
- | (function($){
| + | |
- | | + | |
- | //define the plugin
| + | |
- | $.fn.dcSlickForms = function(options) {
| + | |
- | | + | |
- | //set default options
| + | |
- | var defaults = {
| + | |
- | classError: 'error',
| + | |
- | classForm: 'slick-form',
| + | |
- | align: 'left',
| + | |
- | animateError: true,
| + | |
- | animateD: 10,
| + | |
- | ajaxSubmit: true
| + | |
- | };
| + | |
- | | + | |
- | //call in the default otions
| + | |
- | var options = $.extend(defaults, options);
| + | |
- |
| + | |
- | //act upon the element that is passed into the design
| + | |
- | return this.each(function(options){
| + | |
| | | |
- | // Declare the function variables:
| + | $('.carousel').on('slide.bs.carousel', function (event) { |
- | var formAction = $(this).attr('action');
| + | var tag = $(event.relatedTarget).attr("tag"); |
- | var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
| + | var progress = $(event.relatedTarget).attr("progress"); |
- | var textError = $('#v-error', this).val();
| + | $('#img_home').attr("src", "https://static.igem.org/mediawiki/2014/9/92/Bnu_home.png"); |
- | var textEmail = $('#v-email', this).val(); | + | $('#img_intro').attr("src", "https://static.igem.org/mediawiki/2014/6/6a/Bnu_intro.png"); |
- | var $error = $('<span class="error"></span>');
| + | $('#img_gift').attr("src", "https://static.igem.org/mediawiki/2014/e/e7/Bnu_gift.png"); |
- | var $form = this; | + | $('#img_feedback').attr("src", "https://static.igem.org/mediawiki/2014/f/fb/Bnu_feedback.png"); |
- | var $loading = $('<div class="loading"><span></span></div>');
| + | $('#img_related').attr("src", "https://static.igem.org/mediawiki/2014/7/76/Bnu_related.png"); |
- | var errorText = '* Required Fields';
| + | //$('#img_' + tag).attr("src", "images/" + tag + "_selected.png"); |
- | $('input',$form).focus(function(){
| + | |
- | $(this).addClass('focus');
| + | |
- | });
| + | |
- | $('input',$form).blur(function(){ | + | |
- | $(this).removeClass('focus');
| + | |
- | });
| + | |
- | $('.nocomment').hide();
| + | |
- | $('.defaultText',this).dcDefaultText(); | + | |
- | $('.'+defaults.classForm+' label').hide();
| + | |
- |
| + | |
- | // Form submit & Validation
| + | |
- | $(this).submit(function(){
| + | |
- | | + | |
- | formReset($form);
| + | |
- | $('.defaultText',$form).dcDefaultText({action: 'remove'});
| + | |
- | | + | |
- | // Validate all inputs with the class "required"
| + | |
- | $('.required',$form).each(function(){
| + | |
- | var label = $(this).attr('title');
| + | |
- | var inputVal = $(this).val();
| + | |
- | var $parentTag = $(this).parent();
| + | |
- | if(inputVal == ''){
| + | |
- | $parentTag.addClass('error').append($error.clone().text(textError));
| + | |
- | }
| + | |
- |
| + | |
- | // Run the email validation using the regex for those input items also having class "email"
| + | |
- | if($(this).hasClass('email') == true){
| + | |
- | if(!emailReg.test(inputVal)){
| + | |
- | $parentTag.addClass('error').append($error.clone().text(textEmail));
| + | |
- | }
| + | |
- | }
| + | |
- | });
| + | |
- | | + | |
- | // All validation complete - Check if any errors exist
| + | |
- | // If has errors
| + | |
- | if ($('.error',$form).length) {
| + | |
- | $('.btn-submit',this).before($error.clone().text(textError));
| + | |
- | } else {
| + | |
- | if(defaults.ajaxSubmit == true){
| + | |
- | var $response = $(this).next();
| + | |
- | $(this).addClass('submit').after($loading.clone());
| + | |
- | $('.defaultText',$form).dcDefaultText({action: 'remove'});
| + | |
- | $.post(formAction, $(this).serialize(),function(data){
| + | |
- | $('.loading').fadeOut().remove();
| + | |
- | $response.html(data).fadeIn();
| + | |
- | $('fieldset',this).slideUp();
| + | |
- | });
| + | |
- | } else {
| + | |
- | $form.submit();
| + | |
- | }
| + | |
- | }
| + | |
- | // Prevent form submission
| + | |
- | return false;
| + | |
- | }); | + | |
- |
| + | |
- | // Fade out error message when input field gains focus
| + | |
- | $('input, textarea').focus(function(){
| + | |
- | var $parent = $(this).parent();
| + | |
- | $parent.addClass('focus');
| + | |
- | $parent.removeClass('error');
| + | |
| | | |
| + | //$("#progress").width(progress + "px"); |
| + | //$("#progress").css('left', (progress / 2) - 400 + "px"); |
| + | $("#progress").animate({width: progress, left: (progress / 2) - 400}, 500); |
| + | playAnimation(tag); |
| }); | | }); |
- | $('input, textarea').blur(function(){ | + | $("body,html").animate({ |
- | var $parent = $(this).parent();
| + | scrollTop:($("#page_home .splash-container").offset().top) |
- | var checkVal = $(this).attr('title');
| + | },10); |
- | if (!$(this).val() == checkVal){
| + | |
- | $(this).removeClass('defaulttextActive');
| + | |
- | }
| + | |
- | $parent.removeClass('error focus');
| + | |
- | $('span.error',$parent).hide();
| + | |
- | });
| + | |
| | | |
- | function formReset(obj){ | + | playAnimation("home"); |
- | $('li',obj).removeClass('error');
| + | |
- | $('span.error',obj).remove();
| + | |
- | }
| + | |
- | });
| + | |
- | };
| + | |
- | })(jQuery);
| + | |
- | /*
| + | |
- | * DC jQuery Default Text - jQuery Default Text
| + | |
- | * Copyright (c) 2011 Design Chemical
| + | |
- | * http://www.designchemical.com
| + | |
- | */
| + | |
- | | + | |
- | (function($){
| + | |
- | | + | |
- | //define the plugin
| + | |
- | $.fn.dcDefaultText = function(options) {
| + | |
- |
| + | |
- | //set default options
| + | |
- | var defaults = {
| + | |
- | action: 'add', // alternative 'remove'
| + | |
- | classActive: 'defaultTextActive'
| + | |
- | };
| + | |
- | | + | |
- | //call in the default otions
| + | |
- | var options = $.extend(defaults, options);
| + | |
- |
| + | |
- | return this.each(function(options){
| + | |
| | | |
- | if(defaults.action == 'add'){
| + | }); |
- |
| + | |
- | $(this).focus(function(srcc) {
| + | function switchPage(pageIndex){ |
- | if ($(this).val() == $(this)[0].title) {
| + | $('.carousel').carousel(pageIndex); |
- | $(this).removeClass(defaults.classActive);
| + | } |
- | $(this).val('');
| + | |
- | }
| + | function playAnimation(tag){ |
- | });
| + | var ani1 = $("#page_" + tag + " .ani_step_1"); |
- |
| + | var ani2 = $("#page_" + tag + " .ani_step_2"); |
- | $(this).blur(function() {
| + | var ani3 = $("#page_" + tag + " .ani_step_3"); |
- | if ($(this).val() == "") {
| + | var pre_start = ((tag == "home") ? 0 : 300); |
- | $(this).addClass(defaults.classActive);
| + | if(ani1 != null){ |
- | $(this).val($(this)[0].title);
| + | ani1.css("opacity", 0); |
- | } | + | setTimeout(function(){ |
- | });
| + | ani1.animate({opacity: 1}, 1000); |
- | $(this).addClass(defaults.classActive).blur(); | + | }, 10 + pre_start); |
| } | | } |
- |
| + | if(ani2 != null){ |
- | if(defaults.action == 'remove'){ | + | ani2.css("opacity", 0); |
- |
| + | setTimeout(function(){ |
- | var checkVal = $(this).attr('title'); | + | ani2.animate({opacity: 1}, 1000); |
- | if ($(this).val() == checkVal){ | + | }, 1500 + pre_start); |
- | $(this).val(''); | + | |
- | } | + | |
- |
| + | |
| } | | } |
- | });
| + | if(ani3 != null){ |
- | };
| + | ani3.css("opacity", 0); |
- | })(jQuery);
| + | setTimeout(function(){ |
- | </script>
| + | $("#page_" + tag + " .ani_step_3").animate({opacity: 1}, 1000); |
- | | + | }, 3000 + pre_start); |
- | | + | |
- | | + | |
- | <!--transify-->
| + | |
- | <script type="text/javascript">
| + | |
- | (function($){
| + | |
- | $.fn.transify = function(options) {
| + | |
- | var defaults = {
| + | |
- | opacityOrig:.33,
| + | |
- | fadeSpeed:600
| + | |
- | },
| + | |
- | settings = $.extend({}, defaults, options);
| + | |
- |
| + | |
- | this.each(function() {
| + | |
- | var $this = $(this);
| + | |
- | $this.append('<div class="transify"></div>');
| + | |
- | var transBG = $this.find('.transify');
| + | |
- | transBG.css({
| + | |
- | backgroundColor:$this.css('backgroundColor'),
| + | |
- | backgroundImage:$this.css('backgroundImage'),
| + | |
- | backgroundRepeat:$this.css('backgroundRepeat'),
| + | |
- | borderTopColor:$this.css('borderTopColor'),
| + | |
- | borderTopWidth:$this.css('borderTopWidth'),
| + | |
- | borderTopStyle:$this.css('borderTopStyle'),
| + | |
- | borderRightColor:$this.css('borderRightColor'),
| + | |
- | borderRightWidth:$this.css('borderRightWidth'),
| + | |
- | borderRightStyle:$this.css('borderRightStyle'),
| + | |
- | borderBottomColor:$this.css('borderBottomColor'),
| + | |
- | borderBottomWidth:$this.css('borderBottomWidth'),
| + | |
- | borderBottomStyle:$this.css('borderBottomStyle'),
| + | |
- | borderLeftColor:$this.css('borderLeftColor'),
| + | |
- | borderLeftWidth:$this.css('borderLeftWidth'),
| + | |
- | borderLeftStyle:$this.css('borderLeftStyle'),
| + | |
- | position:'absolute',
| + | |
- | top:0,
| + | |
- | left:0,
| + | |
- | zIndex:-1,
| + | |
- | width:$this.width()+parseInt($this.css("padding-left"), 10) + parseInt($this.css("padding-right"), 10),
| + | |
- | height:$this.height()+parseInt($this.css("padding-top"), 10) + parseInt($this.css("padding-bottom"), 10),
| + | |
- | opacity:settings.opacityOrig});
| + | |
- | if (settings.percentWidth) {
| + | |
- | transBG.css('width',settings.percentWidth); | + | |
| } | | } |
- | if (settings.percentHeight) {
| + | } |
- | transBG.css('height',settings.percentHeight);
| + | |
- | }
| + | |
- | $this.css({
| + | |
- | position:'relative',
| + | |
- | background:'none',
| + | |
- | border:'none'})
| + | |
- |
| + | |
- | if (settings.opacityNew) {
| + | |
- | $this.hover(function() {
| + | |
- | transBG.stop().animate({opacity:settings.opacityNew}, settings.fadeSpeed);
| + | |
- | }, function() {
| + | |
- | transBG.stop().animate({opacity:settings.opacityOrig}, settings.fadeSpeed);
| + | |
- | });
| + | |
- | }
| + | |
- | }); | + | |
- | return this;
| + | |
- | }
| + | |
- | })(jQuery);
| + | |
| </script> | | </script> |
- | | + | <!--[if ls IE 7]> |
- | <script type="text/javascript"> | + | <h2>Please make sure that JavaScript has to be activated for the page to display properly or you should update/change your browser.</h2> |
- | jQuery(document).ready(function($){
| + | <![endif]--> |
- | $('.forms').dcSlickForms();
| + | |
- | });
| + | |
- | </script> | + | |
- | <script type="text/javascript">
| + | |
- | | + | |
- | $(document).ready(function()
| + | |
- | {
| + | |
- | $("#showcase").awShowcase(
| + | |
- | {
| + | |
- | content_width: 900,
| + | |
- | content_height: 400,
| + | |
- | auto: true,
| + | |
- | interval: 3000,
| + | |
- | continuous: false,
| + | |
- | arrows: true,
| + | |
- | buttons: true,
| + | |
- | btn_numbers: true,
| + | |
- | keybord_keys: true,
| + | |
- | mousetrace: false, /* Trace x and y coordinates for the mouse */
| + | |
- | pauseonover: true,
| + | |
- | stoponclick: false,
| + | |
- | transition: 'fade', /* hslide/vslide/fade */
| + | |
- | transition_delay: 0,
| + | |
- | transition_speed: 500,
| + | |
- | show_caption: 'onload' /* onload/onhover/show */
| + | |
- | });
| + | |
- | });
| + | |
- | | + | |
- | </script> | + | |
- | | + | |
- | | + | |
| </head> | | </head> |
| <body> | | <body> |
- | <!-- Fullscreen backgrounds --> | + | <!--<p align="center" style="color: blue;">Coming soon ...</p>--> |
- | <div id="thumbs"> | + | <div id="carousel_container" class="carousel slide full_height"> |
- | <a href="style/images/art/bg1.jpg">1</a>
| + | <div class="carousel-inner full_height"> |
- | <a href="style/images/art/bg2.jpg">2</a> | + | <div id="page_home" class="page item active" tag="home" progress="150"> |
- | <a href="style/images/art/bg3.jpg">3</a>
| + | <div id="main"> |
- | <a href="style/images/art/bg4.jpg">4</a> | + | <div id="splash"> |
- | <a href="style/images/art/bg5.jpg">5</a> | + | <div class="container splash-container"> |
- | <a href="style/images/art/bg6.jpg">6</a>
| + | <img src="https://static.igem.org/mediawiki/2014/7/70/Bnu_title.png" alt="E.coli Prometheus" class="ani_step_1"/> |
- | </div>
| + | <div id="download_btn_group" class="container ani_step_1"> |
- | <div id="superbgimage">
| + | <div id="download_place_holder" class="horizental-item" ></div> |
- | <div class="scanlines"></div>
| + | <div class="horizental-item"> |
- | </div>
| + | <a href="https://2014.igem.org/Team:BNU-China/home.html" id="splash_download_button" class="download-button"> |
- | <!-- End Fullscreen backgrounds -->
| + | <div class="download-title"> |
- | <!-- Begin Wrapper -->
| + | <img class="qrcode" src="https://static.igem.org/mediawiki/2014/1/18/Bnu_qrcode.png" alt="E.coli Prometheus" width="180px" height="180px"><br> |
- | <div id="wrapper"> | + | <span>Skip the Navigation</span> |
- | <div id="header">
| + | </div> |
- | <div class="logo opacity"><a href="index.html"><img src="style/images/logo.png" alt="" /></a></div>
| + | <div class="download-subtitle"> |
- | <div align="right"><a href="https://2014.igem.org/Main_Page"><img src="IGEMsmall.png" width="45px" height="40px"></a></div>
| + | I'll take you to Wiki Main Page Directly! |
- | </div>
| + | </div> |
- | <div class="clear"></div>
| + | </a> |
- | <!-- Begin Menu -->
| + | </div> |
- | <div id="menu" class="menu opacity">
| + | |
- | <ul>
| + | </div> |
- | <li><a href="index.html">Home</a></li>
| + | </div> |
- | <li><a href="#">Project</a>
| + | </div> |
- | <ul>
| + | </div> |
- | <li><a href="overview.html">Overview</a></li>
| + | |
- | <li><a href="modeling.html">Modeling</a></li>
| + | |
- | <li><a href="">...</a></li>
| + | |
- | <li><a href="">...</a></li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="#">Achievements</a>
| + | |
- | <ul>
| + | |
- | <li><a href="results.html">Experiment Results</a></li>
| + | |
- | <li><a href="parts.html">Submitted Parts</a></li>
| + | |
- | <li><a href="future.html">The Bright Future</a></li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="safety.html">Safety</a></li>
| + | |
- | <li><a href="#">Human Practice</a>
| + | |
- | <ul>
| + | |
- | <li><a href="collaboration.html">Collaboration</a></li>
| + | |
- | <li><a href="investigatin.html">Investigation</a></li>
| + | |
- | <li><a href="others.html">Others</a></li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <li><a href="#">Our Team</a>
| + | |
- | <ul>
| + | |
- | <li><a href="profile.html">Team Profile</a></li>
| + | |
- | <li><a href="attributions.html">Attributions</a></li>
| + | |
- | <li><a href="time_axis.html">Time Axis</a></li>
| + | |
- | <li><a href="acknowledge.html">Acknowledge</a></li>
| + | |
- | </ul>
| + | |
- | </li>
| + | |
- | <br style="clear: left" />
| + | |
- | </div>
| + | |
- | <!-- End Menu -->
| + | |
- |
| + | |
- | <!-- Begin Container -->
| + | |
- | <div id="container" class="opacity">
| + | |
- |
| + | |
- | <!-- Begin Showcase -->
| + | |
- | <div id="showcase" class="showcase">
| + | |
- | <!-- Each child div in #showcase represents a slide -->
| + | |
- | <div class="showcase-slide">
| + | |
- | <!-- Put the slide content in a div with the class .showcase-content. -->
| + | |
- | <div class="showcase-content"> <img src="style/images/art/s1.jpg" alt="1" /> </div>
| + | |
- | </div>
| + | |
- |
| + | |
- | <!-- Each child div in #showcase represents a slide -->
| + | |
- | <!--1-->
| + | |
- | <div class="showcase-slide">
| + | |
- | <!-- Put the slide content in a div with the class .showcase-content. -->
| + | |
- | <div class="showcase-content"> <img src="style/images/art/s2.jpg" alt="2" /> </div>
| + | |
- | <div class="showcase-caption">
| + | |
- | Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.
| + | |
| </div> | | </div> |
- | </div>
| + | <div id="page_intro" class="page item" tag="intro" progress="300"> |
- | <!--2-->
| + | <div id="main"> |
- | <div class="showcase-slide">
| + | <div id="splash" class="ani_step_1"> |
- | <div class="showcase-content"> <img src="style/images/art/s3.jpg" alt="3" /> </div>
| + | <div class="container splash-container"> |
- | <div class="showcase-caption">
| + | <img src="https://static.igem.org/mediawiki/2014/a/a1/Bnu_intro_splash.jpg" alt="E.coli Prometheus feels so bad when he saw the Bad growth of peanuts" width="70%"/> |
- | Nulla vitae elit libero, a pharetra augue. Nullam id dolor id nibh ultricies vehicula ut id elit.
| + | </div> |
| + | |
| + | <a href="https://2014.igem.org/Team:BNU-China/pp_overview.html" id="splash_download_button" class="download-button ani_step_1"> |
| + | <div class="download-title"> |
| + | What happened to the peanut? <img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out what happened to peanuts"> |
| + | </div> |
| + | </a> |
| + | </div> |
| + | </div> |
| </div> | | </div> |
- | </div>
| + | <div id="page_gift" class="page item" tag="gift" progress="450"> |
- | <!--3-->
| + | <div id="main"> |
- | <div class="showcase-slide">
| + | <div id="splash"> |
- | <!-- Put the slide content in a div with the class .showcase-content. -->
| + | <div class="container splash-container ani_step_1"> |
- | <div class="showcase-content"> <img src="style/images/art/s4.jpg" alt="4" /> </div>
| + | <img src="https://static.igem.org/mediawiki/2014/d/d6/Bnu_gift_splash.gif" alt="E.coli Prometheus transformed by BNU-iGEM" width="70%"/> |
- | </div>
| + | </div> |
- | <!--4-->
| + | <a href="https://2014.igem.org/Team:BNU-China/overview.html" id="splash_download_button" class="download-button ani_step_1"> |
- | <div class="showcase-slide">
| + | <div class="download-title"> |
- | <!-- Put the slide content in a div with the class .showcase-content. -->
| + | How we did this <img src="https://static.igem.org/mediawiki/2014/8/87/Bnu_arrow_gift.png" alt="To check out hao we transform the e.coli"> |
- | <div class="showcase-content"> <img src="style/images/art/s4.jpg" alt="4" /> </div>
| + | </div> |
- | <div class="showcase-caption">
| + | </a> |
- | Praesent commodo cursus magna, vel scelerisque nisl consectetur et. | + | </div> |
| + | </div> |
| + | </div> |
| + | <div id="page_feedback" class="page item" tag="feedback" progress="600"> |
| + | <div id="main"> |
| + | <div id="splash"> |
| + | <div class="container splash-container ani_step_1"> |
| + | <img src="https://static.igem.org/mediawiki/2014/a/a8/Bnu_delivery.gif" alt="deliver the Mo to peanut" width="70%"/> |
| + | </div> |
| + | <a href="https://2014.igem.org/Team:BNU-China/Chemotaxis.html" id="splash_download_button" class="download-button ani_step_1"> |
| + | <div class="download-title"> |
| + | The delivery system <img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out how the delivery system works"> |
| + | </div> |
| + | </a> |
| + | </div> |
| + | </div> |
| + | </div> |
| + | <div id="page_related" class="page item" tag="related" progress="750"> |
| + | <div id="main"> |
| + | <div id="splash"> |
| + | <div class="container splash-container"> |
| + | <img src="https://static.igem.org/mediawiki/2014/0/05/Bnu_safety.gif" alt="E.coli Prometheus died for safety after deliver Mo to peanut" width="70%"/> |
| + | </div> |
| + | <a href="https://2014.igem.org/Team:BNU-China/safety-overview" id="splash_download_button" class="download-button ani_step_1"> |
| + | <div class="download-title"> |
| + | The Safety system <img src="https://static.igem.org/mediawiki/2014/9/94/Bnu_arrow_feedback.png" alt="To check out how the safety system works"> |
| + | </div> |
| + | </a> |
| + | </div> |
| + | </div> |
| + | </div> |
| + | </div> |
| + | </div> |
| + | <div class="footer" > |
| + | <div id="navbar"> |
| + | <div id="dash" ></div> |
| + | <div id="progress"></div> |
| + | <div id="navbtns" class="container" > |
| + | <div class="navbtn"> |
| + | <a href="javascript:switchPage(0)"> |
| + | <img id="img_home" src="https://static.igem.org/mediawiki/2014/1/1c/Bnu_home_selected.png" alt="0"> |
| + | <div>Prometheus</div> |
| + | </a> |
| + | </div> |
| + | <div class="navbtn"> |
| + | <a href="javascript:switchPage(1)"> |
| + | <img id="img_intro" src="https://static.igem.org/mediawiki/2014/6/6a/Bnu_intro.png" alt="1"> |
| + | <div>Peanut</div> |
| + | </a> |
| + | </div> |
| + | <div class="navbtn"> |
| + | <a href="javascript:switchPage(2)"> |
| + | <img id="img_gift" src="https://static.igem.org/mediawiki/2014/e/e7/Bnu_gift.png" alt="2"> |
| + | <div>Armed</div> |
| + | </a> |
| + | </div> |
| + | <div class="navbtn"> |
| + | <a href="javascript:switchPage(3)"> |
| + | <img id="img_feedback" src="https://static.igem.org/mediawiki/2014/f/fb/Bnu_feedback.png" alt="3"> |
| + | <div>Delivery</div> |
| + | </a> |
| + | </div> |
| + | <div class="navbtn"> |
| + | <a href="javascript:switchPage(4)"> |
| + | <img id="img_related" src="https://static.igem.org/mediawiki/2014/7/76/Bnu_related.png" alt="4"> |
| + | <div>Safety</div> |
| + | </a> |
| + | </div> |
| </div> | | </div> |
- | </div>
| |
- | <!--end of silde content-->
| |
| </div> | | </div> |
- | <!-- End Showcase -->
| |
- |
| |
- | <div class="intro">Aenean fringilla aliquam est, a porttitor arcu euismod et. Maecenas rutrum erat at arcu porta interdum. Cras convallis ligula ac risus imperdiet placerat.</div>
| |
- | <div class="hr2"></div>
| |
- | <!-- Divider -->
| |
- |
| |
- | <!-- Begin Top Columns -->
| |
- | <h2>What We Do</h2>
| |
- | <div class="two-third">
| |
- | <p>Vivamus sodales pharetra libero, a tincidunt nisi condimentum a. Quisque non sodales nislero. Integer a tellus eget arcu fringilla molestie quis vel eros. Praesent fermentum vulputate purusa ornare. Vivamus imperdiet, quam et adipiscing placerat, nibh odio scelerisque risus, vitaere accumsan mi justo et quam. Pellentesque quis felis quis tortor porttitor lobortis nec ac risus.</p>
| |
- | </div>
| |
- | <div class="one-third last">
| |
- | <ul>
| |
- | <li>Vivamus at magna non ipsum.</li>
| |
- | <li>Etiam pharetra pretium eros.</li>
| |
- | <li>Curabitur porttitor ipsum nec magna.</li>
| |
- | <li>Maecenas cursus arcu a nulla tristique.</li>
| |
- | </ul>
| |
- | </div>
| |
- | <!-- End Top Columns -->
| |
- |
| |
- | <div class="clear"></div>
| |
- | <br />
| |
- | <br />
| |
- | <br />
| |
- |
| |
- | <!-- Begin 4 Columns -->
| |
- |
| |
- | <div class="one-fourth"> <img src="style/images/icon1.png" alt="" class="center" /><br />
| |
- | <h4 class="center">Web Design</h4>
| |
- | <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
| |
- | </div>
| |
- | <div class="one-fourth"> <img src="style/images/icon2.png" alt="" class="center" /><br />
| |
- | <h4 class="center">Photography</h4>
| |
- | <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
| |
- | </div>
| |
- | <div class="one-fourth"> <img src="style/images/icon3.png" alt="" class="center" /><br />
| |
- | <h4 class="center">Motion Graphic</h4>
| |
- | <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
| |
- | </div>
| |
- | <div class="one-fourth last"> <img src="style/images/icon4.png" alt="" class="center" /><br />
| |
- | <h4 class="center">Optimization</h4>
| |
- | <p class="center">Vivamus soder pharetra libero atincidunt, nisi condimentum Quisque non sodales nislero.</p>
| |
- | </div>
| |
- | <div class="clear"></div>
| |
- | <div class="hr1"></div>
| |
- | <!-- Divider -->
| |
- |
| |
- | <!-- Begin Latest Works -->
| |
- | <h2>Latest Works</h2>
| |
- | <div class="carousel">
| |
- | <div id="carousel-scroll"><a href="#" id="prev">Prev</a><a href="#" id="next">Next</a></div>
| |
- | <ul>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c1.jpg" alt="" /> </a> </li>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c2.jpg" alt="" /> </a> </li>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c3.jpg" alt="" /> </a> </li>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c4.jpg" alt="" /> </a> </li>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c5.jpg" alt="" /> </a> </li>
| |
- | <li> <a href="#"> <span>describe</span><img src="style/images/art/c6.jpg" alt="" /> </a> </li>
| |
- | </ul>
| |
- | </div>
| |
- | <!-- End Latest Works -->
| |
- |
| |
- | <div id="footer">
| |
- | <div class="footer-top"></div>
| |
- | <div class="clear"></div>
| |
- | <!--sponsor-->
| |
- | <div class="two-third">
| |
- | <h3>Our Sponsors</h3>
| |
- | <ul class="flickr">
| |
- | <li><a href="#"><img src="style/images/art/f1.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f2.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f3.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f4.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f5.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f6.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f7.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f8.jpg" alt="" /></a></li>
| |
- | <li><a href="#"><img src="style/images/art/f9.jpg" alt="" /></a></li>
| |
- | </ul>
| |
- | </div>
| |
- | </div>
| |
- | <div class="clear"></div>
| |
- | </div>
| |
- | </div>
| |
- | <!-- End Container -->
| |
- |
| |
- | <div id="copyright" class="opacity">
| |
- | <p>E.coli Prometheus: I live for the trees and die for safety</p>
| |
- | </div>
| |
| </div> | | </div> |
- | <!-- End Wrapper -->
| |
| | | |
- | <script type="text/javascript">
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* BACKGROUND IMAGE
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- |
| |
- | $(function() {
| |
- |
| |
- | // Options for SuperBGImage
| |
- | $.fn.superbgimage.options = {
| |
- | randomtransition: 2, // 0-none, 1-use random transition (0-7)
| |
- | z_index: -1, // z-index for the container
| |
- | slideshow: 1, // 0-none, 1-autostart slideshow
| |
- | slide_interval: 4000, // interval for the slideshow
| |
- | randomimage: 1, // 0-none, 1-random image
| |
- | speed: 'slow' // animation speed
| |
- | };
| |
- |
| |
- | // initialize SuperBGImage
| |
- | $('#thumbs').superbgimage().hide();
| |
- |
| |
- | });
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* MENU
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- |
| |
- | ddsmoothmenu.init({
| |
- | mainmenuid: "menu",
| |
- | orientation: 'h',
| |
- | classname: 'menu',
| |
- | contentsource: "markup"
| |
- | })
| |
- |
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* IMAGE HOVER
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | $(function() {
| |
- | $('.flickr img, .blog a img, #.container a img, .content a img').css("opacity","1.0");
| |
- | $('.flickr img, .blog a img, #container a img, .content a img').hover(function () {
| |
- | $(this).stop().animate({ opacity: 0.75 }, "fast"); },
| |
- | function () {
| |
- | $(this).stop().animate({ opacity: 1.0 }, "fast");
| |
- | });
| |
- | });
| |
- |
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* OPACITY
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- |
| |
- | $('.opacity').transify({opacityOrig:.90, percentHeight:'100%'});
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* PRETTYPHOTO
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- |
| |
- | $(document).ready(function(){
| |
- | $("a[rel^='prettyPhoto']").prettyPhoto({autoplay_slideshow: false, overlay_gallery: false, social_tools:false, deeplinking: false, theme:'pp_default', slideshow:5000});
| |
- | });
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* TOGGLE
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | $(document).ready(function(){
| |
- | //Hide the tooglebox when page load
| |
- | $(".togglebox").hide();
| |
- | //slide up and down when click over heading 2
| |
- | $("h2").click(function(){
| |
- | // slide toggle effect set to slow you can set it to fast too.
| |
- | $(this).toggleClass("active").next(".togglebox").slideToggle("slow");
| |
- | return true;
| |
- | });
| |
- | });
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* TABS
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | $(document).ready(function() {
| |
- | //Default Action
| |
- | $(".tab_content").hide(); //Hide all content
| |
- | $("ul.tabs li:first").addClass("active").show(); //Activate first tab
| |
- | $(".tab_content:first").show(); //Show first tab content
| |
- |
| |
- | //On Click Event
| |
- | $("ul.tabs li").click(function() {
| |
- | $("ul.tabs li").removeClass("active"); //Remove any "active" class
| |
- | $(this).addClass("active"); //Add "active" class to selected tab
| |
- | $(".tab_content").hide(); //Hide all tab content
| |
- | var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
| |
- | $(activeTab).fadeIn(); //Fade in the active content
| |
- | return false;
| |
- | });
| |
- |
| |
- | });
| |
- |
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | /* IMAGE HOVER
| |
- | /*-----------------------------------------------------------------------------------*/
| |
- | $(document).ready(function() {
| |
- | $('.box, .carousel ul li').mouseenter(function(e) {
| |
- |
| |
- | $(this).children('a').children('span').fadeIn(200);
| |
- | }).mouseleave(function(e) {
| |
- |
| |
- | $(this).children('a').children('span').fadeOut(200);
| |
- | });
| |
- | });
| |
- |
| |
- | </script>
| |
| </body> | | </body> |
| </html> | | </html> |