2009-03-13 6 views

Répondre

2
var scrollEffect = Effect.ScrollTo("bottom", { duration: 5.0 }); 

... 

scrollEffect.cancel(); 

Ce code ci-dessous fonctionne parfaitement pour moi:

<html> 
<head> 
    <script src="js/prototype.js" type="text/javascript"></script> 
    <script src="js/scriptaculous.js" type="text/javascript"></script> 

    <style type="text/css" media="screen"> 
     body { font-size: 30px; } 
     #destination { margin-top: 1400px; } 
     #start { position: fixed; top: 10px; left: 20px;} 
     #stop { position: fixed; top: 50px; left: 20px;} 
    </style> 

    <script type="text/javascript" charset="utf-8"> 
     function startEffect() { 
      scrollEffect = Effect.ScrollTo("destination", { duration: 8.0 }); return false; 
     } 

     function stopEffect() { 
      scrollEffect.cancel(); return false; 
     } 
    </script> 
</head> 
<body> 
    <a id="start" href="#" onclick="return startEffect();">Start Effect</a> 
    <a id="stop" href="#" onclick="return stopEffect();">Stop Effect</a> 
    <p id="destination">Scroll Destination</p> 
</body> 
</html> 
+1

@Tyson - Eh bien, cela semble fonctionner, mais pas comme je le voulais. Votre solution me fait retourner à l'endroit où le parchemin a commencé, et ce que je veux, c'est que le parchemin s'arrête là où il est. Merci quand même :) – unrelativity

+0

Selon les docs, il faut "arrêter l'effet tel quel". http://wiki.github.com/madrobby/scriptaculous/core-effects – Tyson

+0

Hmm, étrange. Utilisez-vous Firefox 3? – unrelativity

0

Ce que je travaille actuellement est actuellement ayant un div comme suit:

<div id="pausepos" style="position:absolute;"></div> 

Ensuite, ayant le JavaScript annuler le défilement et le ramener à l'endroit où se trouvait la position d'origine:

fallingPosTempArr = $("thetop").viewportOffset(); 
    fallingPosTemp = -1*fallingPosTempArr[1]; 

    $("pausepos").setStyle({ 
     "top" : fallingPosTemp + 'px' 
    }); 

    scrollEffect.cancel(); 

    setTimeout(function() { Effect.ScrollTo("pausepos", { duration: 0.0 }); }, 10); 

Cela fonctionne, mais sur les navigateurs plus lents, vous pouvez voir comment la page retourne vers le haut, puis revient à nouveau.

Questions connexes