Widget:Slideshow: Difference between revisions
From CSDMS
No edit summary |
No edit summary |
||
| Line 37: | Line 37: | ||
[[Category:Widgets]] | [[Category:Widgets]] | ||
</noinclude><includeonly><!--Widget:Slideshow--><style type="text/css">.slideshow { position: relative; width: <!--{$width|escape:'html'}-->px; height: <!--{$height|escape:'html'}-->px; overflow: hidden; margin: 0 0 1em 1em; } .slideshow img { position: absolute; left: 0; top: 0; width: <!--{$width|escape:'html'}-->px; height: <!--{$height|escape:'html'}-->px; }</style><script type="text/javascript" src="/ | </noinclude><includeonly><!--Widget:Slideshow--><style type="text/css">.slideshow { position: relative; width: <!--{$width|escape:'html'}-->px; height: <!--{$height|escape:'html'}-->px; overflow: hidden; margin: 0 0 1em 1em; } .slideshow img { position: absolute; left: 0; top: 0; width: <!--{$width|escape:'html'}-->px; height: <!--{$height|escape:'html'}-->px; }</style><script type="text/javascript" src="/mediawiki/skins/csdmsskin_new/jquery-slideshow/js/jquery-slideshow.min.js"></script><script type="text/javascript"> $(".slideshow").slideshow({ timeout: 5000, fadetime: 2000 }); </script> </includeonly> | ||
Revision as of 10:58, 12 July 2011
This widget creates a slideshow from a series of images contained in a div with the css selector slideshow applied.
Dependencies:
/mediawiki/skins/csdmsskin_new/jquery-slideshow/js/jquery-slideshow.min.js
Parameters include:
- width - width of images
- height - height of images
For example:
<div class="slideshow">
[[File:Votingfrontpage.jpg]]
[[File:Frontpage_meeting_madeby_TEDxBoulder.jpg]]
[[File:SummerInstitute2011frontpage.jpg]]
</div>
{{#Widget:Slideshow
|width=680
|height=320
}}
