"
Team:Heidelberg/NivoSlider
From 2010.igem.org
(Difference between revisions)
| (20 intermediate revisions not shown) | |||
| Line 57: | Line 57: | ||
.nivo-directionNav a { | .nivo-directionNav a { | ||
position:absolute; | position:absolute; | ||
| - | top: | + | top:40%; |
z-index:99; | z-index:99; | ||
cursor:pointer; | cursor:pointer; | ||
display:block; | display:block; | ||
| - | width: | + | width:25px; |
| - | height: | + | height:50px; |
background:url(https://static.igem.org/mediawiki/2010/f/f0/Arrows.png) no-repeat; | background:url(https://static.igem.org/mediawiki/2010/f/f0/Arrows.png) no-repeat; | ||
text-indent:-9999px; | text-indent:-9999px; | ||
| Line 68: | Line 68: | ||
} | } | ||
a.nivo-nextNav { | a.nivo-nextNav { | ||
| - | background-position:- | + | background-position:-25px 0; |
| - | right: | + | right:0px; |
} | } | ||
a.nivo-prevNav { | a.nivo-prevNav { | ||
| - | left: | + | left:0px; |
} | } | ||
/* Control nav styles (e.g. 1,2,3...) */ | /* Control nav styles (e.g. 1,2,3...) */ | ||
| Line 107: | Line 107: | ||
margin:30px 30px 60px 30px; | margin:30px 30px 60px 30px; | ||
background:#202834 url(https://static.igem.org/mediawiki/2010/4/42/Loading.gif) no-repeat 50% 50%; | background:#202834 url(https://static.igem.org/mediawiki/2010/4/42/Loading.gif) no-repeat 50% 50%; | ||
| - | |||
| - | |||
| - | |||
} | } | ||
.nivoSlider img { | .nivoSlider img { | ||
| Line 128: | Line 125: | ||
.nivo-directionNav a { | .nivo-directionNav a { | ||
display:block; | display:block; | ||
| - | width: | + | width:25px; |
| - | height: | + | height:50px; |
background:url(https://static.igem.org/mediawiki/2010/f/f0/Arrows.png) no-repeat; | background:url(https://static.igem.org/mediawiki/2010/f/f0/Arrows.png) no-repeat; | ||
text-indent:-9999px; | text-indent:-9999px; | ||
| Line 135: | Line 132: | ||
} | } | ||
a.nivo-nextNav { | a.nivo-nextNav { | ||
| - | background-position:- | + | background-position:-25px 0; |
| - | right: | + | right:-1px; |
} | } | ||
a.nivo-prevNav { | a.nivo-prevNav { | ||
| - | left: | + | left:-10px; |
} | } | ||
| Line 177: | Line 174: | ||
position:absolute; | position:absolute; | ||
left:29%; | left:29%; | ||
| - | bottom:- | + | bottom:-60px; |
} | } | ||
#slider .nivo-controlNav img { | #slider .nivo-controlNav img { | ||
| Line 265: | Line 262: | ||
margin:20px 0 20px 0; | margin:20px 0 20px 0; | ||
background:#202834 url(https://static.igem.org/mediawiki/2010/4/42/Loading.gif) no-repeat 50% 50%; | background:#202834 url(https://static.igem.org/mediawiki/2010/4/42/Loading.gif) no-repeat 50% 50%; | ||
| - | |||
| - | |||
| - | |||
} | } | ||
#slider img { | #slider img { | ||
| Line 287: | Line 281: | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
| - | |||
$(window).load(function() { | $(window).load(function() { | ||
$('#slider').nivoSlider({ | $('#slider').nivoSlider({ | ||
| - | + | effect:'fade', //Specify sets like: 'fold,fade,sliceDown' | |
| - | + | slices:3, | |
| - | }); | + | animSpeed:500, //Slide transition speed |
| + | pauseTime:8000, | ||
| + | startSlide:0, //Set starting Slide (0 index) | ||
| + | directionNav:true, //Next & Prev | ||
| + | directionNavHide:false, //Only show on hover | ||
| + | controlNav:true, //1,2,3... | ||
| + | controlNavThumbs:true, //Use thumbnails for Control Nav | ||
| + | controlNavThumbsFromRel:true, //Use image rel for thumbs | ||
| + | keyboardNav:true, //Use left & right arrows | ||
| + | pauseOnHover:true, //Stop animation while hovering | ||
| + | manualAdvance:false, //Force manual transitions | ||
| + | captionOpacity:1, //Universal caption opacity | ||
| + | beforeChange: function(){}, | ||
| + | afterChange: function(){}, | ||
| + | slideshowEnd: function(){} //Triggers after all slides have been shown | ||
| + | }); | ||
}); | }); | ||
</script> | </script> | ||
Latest revision as of 00:21, 18 November 2010
