Modifications pour le document TestTransitions
Modifié par Paul Libbrecht le 2013/09/11 12:57
modifié par Paul Libbrecht (admin)
sur 2013/09/10 13:13
sur 2013/09/10 13:13
modifié par Paul Libbrecht (admin)
sur 2013/09/10 13:23
sur 2013/09/10 13:23
Commentaire de modification :
avec scriptaculous
Résumé
Détails
- Propriétés de la Page
-
- Contenu
-
... ... @@ -1,8 +1,26 @@ 1 1 {{html clean="false"}} 2 2 3 -<script type='text/javascript' src="/xwiki/js/jquery.innerfade/jquery.innerfade.js"/> 4 -<link href="/xwiki/js/jquery.innerfade/jq_fade.css" rel="stylesheet" type="text/css" media="screen" /> 3 + <script type="text/javascript">// <![CDATA[ 4 +var Slides = new Array(); 5 +var wait = 5000; 6 +var i=0; 5 5 8 +function SlideShow() 9 +{ 10 + Effect.Fade(Slides[i], { duration:2, from:1.0, to:0.0 }); 11 + i++; 12 + if (i == Slides.length) i = 0; 13 + Effect.Appear(Slides[i], { duration:2, from:0.0, to:1.0 }); 14 +} 15 + 16 +document.observe('dom:loaded',function() 17 + { 18 + setInterval(SlideShow, wait); 19 + Slides = $$('#news>li').toArray(); 20 + } 21 + ); 22 +// ]]></script> 23 + 6 6 <ul id="news"> 7 7 <li> 8 8 <a href="#n1">1 Lorem ipsum dolor</a> ... ... @@ -30,33 +30,4 @@ 30 30 </li> 31 31 </ul> 32 32 33 -<script type="text/javascript"> 34 - jQuery = $; 35 - $(document).ready( 36 - function(){ 37 - $('#news').innerfade({ 38 - animationtype: 'slide', 39 - speed: 750, 40 - timeout: 2000, 41 - type: 'random', 42 - containerheight: '1em' 43 - }); 44 - 45 - $('#portfolio').innerfade({ 46 - speed: 'slow', 47 - timeout: 4000, 48 - type: 'sequence', 49 - containerheight: '220px' 50 - }); 51 - 52 - $('.fade').innerfade({ 53 - speed: 'slow', 54 - timeout: 1000, 55 - type: 'sequence', 56 - containerheight: '1.5em' 57 - }); 58 - } 59 - ); 60 - 61 -</script> 62 62 {{/html}}