Je début en javascript et j'aimerais faire un petit bout de code qui me permettrait de faire un scroll automatique d'une ancre (qui sera en bas de page) vers le haut.
J'ai un peu regardé du côté de smoothscroll ou du Fx.scroll de mootools, mais j'arrive pas à les intégrer, et ensuite de les modifier afin que ce ne soit pas sur un évenement 'click' mais sur un settimeout.
En résumé, j'aimerais un effet comme celui là, mais automatique, et au bout de 3/5 sec...
J'espère que ma requête est compréhensible
[edit] changement du titre pour plus de pertinence
D'avance merci.
[edit] Bon et bien j'ai trouvé la solution
J'ai donc utilisé la librairie mootools et ajax.
Ce qui donne :
Code : Tout sélectionner
<html>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/moo.extend.js"></script>
<script type="text/javascript">
Fx.Properties = Fx.Styles.extend({
increase: function(){for ( var p in this.now) this.element[p] = this.now[p]; }
});
Fx.FlyingScroller = Fx.Properties.extend({
initialize: function(el, options){
this.parent(el, options);
this.options = Object.extend(this.options || {}, Object.extend({
paddingLeft: 0,
paddingTop: 0
}, options || {}));
},
toElement: function(el, paddingLeft, paddingTop){
this.goTo(el.offsetLeft - (paddingLeft || this.options.paddingLeft || 0), el.offsetTop - (paddingTop || this.options.paddingTop || 0));
},
goTo: function(x, y){
this.custom({
'scrollLeft': [this.element.scrollLeft, x],
'scrollTop': [this.element.scrollTop, y]
})
}
});
</script>
<script > setTimeout("panel.clearTimer().toElement($('content2')); return false;",6000)</script>
<style type="text/css">
/* Définition des parametres d'affichage*/
.scrolling-content{position:absolute;width: 0px;height:0px;}
#tile-wrap{;overflow: hidden;position: relative}
#tile-inner{width: 1676px; height: 947px; }
/* gestion de la vitesse de défilement avec le parametre top */
#content1{left: 0px;top: 250px;}
</style>
</html>Code : Tout sélectionner
<html>
<script type="text/javascript">
var panel = new Fx.FlyingScroller($('tile-wrap'), {
transition: Fx.Transitions.quadInOut,
duration: 2400,
paddingLeft: 0,
paddingTop:0
});
</script>
</html>