Je pense que c'est ce que vous voulez:
Demo: http://jsfiddle.net/SO_AMK/Q6KNk/
jQuery:
var div2Pos = $("#div2").position();
$("#square").css({
position: 'absolute',
top: $("#square").position().top,
left: $("#square").position().left
});
$("#square").animate({
top: div2Pos.top
}, 1000);
HTML:
<div id="square">Lorem Ipsum...</div>
<div id="div2">Lorem Ipsum...</div>
CSS:
#square {
width: 100px;
height: 100px;
background-color: lightBlue;
position: fixed;
bottom: 0;
}
#div2 {
width: 100px;
height: 100px;
background-color: lightGreen;
position: relative;
top: 30px;
}
Fondamentalement, il obtient la position de div2
met alors #square
à sa position actuelle, mais en utilisant à la place absolue de positionnement fixe de sorte que l'animation occu rs au lieu de sauter au sommet.
NOTE: Cela ne fonctionnera pas si square
est à l'intérieur d'un élément relativement positionné!
D'où ça vient-il? Le bas de la page? S'il vous plaît ajouter plus d'informations. –
Il est fixé au bas du navigateur. – dcolumbus