Stopper une animation [Résolu]

[bast292]

Bonjour, je suis en train de créer un site dans lequel j'ai intégrer un newsticker (défilement d'infos), seulement je sais que ca peut paraître lourd au bout d'un moment, j'aimerai donc que les utilisateurs puissent le stopper. Mais n'étant pas spécialiste du js j'ai quelques soucis.

Voilà le code que j'ai mis dans le head :

Code :

1
2
3
4
5
<script type="text/javascript">	
	 $(function(){
     $("ul#ticker01").liScroll();
      }); 	
	</script>

et le fichier js

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
jQuery.fn.liScroll = function(settings) {
		settings = jQuery.extend({
		travelocity: 0.04
		}, settings);		
		return this.each(function(){
				var $strip = jQuery(this);
				$strip.addClass("newsticker")
				var stripWidth = 0;
				var $mask = $strip.wrap("<div class='mask'></div>");
				var $tickercontainer = $strip.parent().wrap("<div class='tickercontainer'></div>");								
				var containerWidth = $strip.parent().parent().width();	//a.k.a. 'mask' width 	
				$strip.find("li").each(function(i){
				stripWidth += jQuery(this, i).outerWidth(true); // thanks to Michael Haszprunar
				});
				$strip.width(stripWidth);			
				var totalTravel = stripWidth+containerWidth;
				var defTiming = totalTravel/settings.travelocity;	// thanks to Scott Waye		
				function scrollnews(spazio, tempo){
				$strip.animate({left: '-='+ spazio}, tempo, "linear", function(){$strip.css("left", containerWidth); scrollnews(totalTravel, defTiming);});
				}
				scrollnews(totalTravel, defTiming);				
				$strip.hover(function(){
				jQuery(this).stop();
				},
				function(){
				var offset = jQuery(this).offset();
				var residualSpace = offset.left + stripWidth;
				var residualTime = residualSpace/settings.travelocity;
				scrollnews(residualSpace, residualTime);
				});			
		});	
};

et enfin ce sur quoi il agit :

Code :

1
2
3
4
5
6
7
8
<ul id="ticker01">
 
      <li><span>22/02/2011</span>Bienvenue sur le site.....</li>
 
      <li><span>22/02/2011</span>texte 2 blablabla..........</li>
 
	   <li><span>22/02/2011</span> texte 3......................</li>
        </ul>

J'aimerai donc placer un lien (ou image) qui puisse stopper le défilement, et pourquoi pas le reprendre.

Merci d'avance

[SpaceFrog]

Code :

.stop()

[bast292]

Envoyé par SpaceFrog

Code :

.stop()

Oui, mais où ?

[SpaceFrog]

sur l'objet qui est animé ...

[bast292]

un exemple ?

[SpaceFrog]

Code :

 $("#ticker01").stop()

[bast292]

Envoyé par SpaceFrog

Code :

 $("#ticker01").stop()

Merci beaucoup, j'ai réussi à m'en sortir