Team:ULB-Brussels
From 2014.igem.org
(Difference between revisions)
Line 3: | Line 3: | ||
<html> | <html> | ||
- | < | + | <!--init and scripts --> |
- | < | + | <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jquery-1.9.1.min.js"></script> |
- | + | <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.core.js"></script> | |
- | + | <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.utils.js"></script> | |
- | + | <script type="text/javascript" src="https://raw.githubusercontent.com/jssor/jquery-slider/master/js/jssor.slider.js"></script> | |
- | + | <script> | |
- | + | jssor_slider1_starter = function (containerId) { | |
- | < | + | |
+ | var options = { | ||
+ | $AutoPlay: false, | ||
+ | $SlideDuration: 800, | ||
+ | $BulletNavigatorOptions: { | ||
+ | $Class: $JssorBulletNavigator$, | ||
+ | $ChanceToShow: 2, | ||
+ | $AutoCenter: 1, | ||
+ | $Steps: 1, | ||
+ | $Lanes: 1, | ||
+ | $SpacingX: 10, | ||
+ | $SpacingY: 10, | ||
+ | $Orientation: 1 | ||
+ | } | ||
+ | }; | ||
+ | |||
+ | var jssor_slider1 = new $JssorSlider$(containerId, options); | ||
+ | } | ||
+ | </script> | ||
<!--main content --> | <!--main content --> | ||
- | <table style="background-color: | + | <table style="background-color:#ebebeb;" align="center" width="100%"> <!-- Jssor Slider Begin --> |
+ | <!-- You can move inline styles to css file or css block. --> | ||
+ | <div id="slider1_container" style="position: relative; width: 960px; | ||
+ | height: 320px; overflow: hidden; margin-left: auto; margin-right: auto"> | ||
+ | |||
+ | <!-- Slides Container --> | ||
+ | <div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width: 960px; height: 320px; | ||
+ | overflow: hidden;"> | ||
+ | <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/87/ULB2014PLACEHOLDER1.png" /></div> | ||
+ | <div><img u="image" src="https://static.igem.org/mediawiki/2014/8/82/ULB2014PLACEHOLDER2.png" /></div> | ||
+ | </div> | ||
+ | |||
+ | <!-- Bullet Navigator Skin Begin --> | ||
+ | <style> | ||
+ | /* jssor slider bullet navigator skin 05 css */ | ||
+ | /* | ||
+ | .jssorb05 div (normal) | ||
+ | .jssorb05 div:hover (normal mouseover) | ||
+ | .jssorb05 .av (active) | ||
+ | .jssorb05 .av:hover (active mouseover) | ||
+ | .jssorb05 .dn (mousedown) | ||
+ | */ | ||
+ | .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av | ||
+ | { | ||
+ | background: url(https://static.igem.org/mediawiki/2014/c/c2/ULB2014BULLETS2.png) no-repeat; | ||
+ | overflow:hidden; | ||
+ | cursor: pointer; | ||
+ | } | ||
+ | .jssorb05 div { background-position: -7px -7px; } | ||
+ | .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; } | ||
+ | .jssorb05 .av { background-position: -67px -7px; } | ||
+ | .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; } | ||
+ | </style> | ||
+ | <!-- bullet navigator container --> | ||
+ | <div u="navigator" class="jssorb05" style="position: absolute; bottom: 16px; right: 6px;"> | ||
+ | <!-- bullet navigator item prototype --> | ||
+ | <div u="prototype" style="POSITION: absolute; WIDTH: 16px; HEIGHT: 16px;"></div> | ||
+ | </div> | ||
+ | <!-- Bullet Navigator Skin End --> | ||
+ | |||
+ | <a style="display: none" href="http://www.jssor.com">carousel slider</a> | ||
+ | <!-- Trigger --> | ||
+ | <script> | ||
+ | jssor_slider1_starter('slider1_container'); | ||
+ | </script> | ||
+ | </div> | ||
+ | <!-- Jssor Slider End --> | ||
<tr><th><table style="background-color:#ebebeb;" width="90%" align="center" style="border:1px solid black;" > | <tr><th><table style="background-color:#ebebeb;" width="90%" align="center" style="border:1px solid black;" > | ||
Revision as of 21:53, 7 July 2014
|
---|