Voilà mon problème :
J'ai une div à 600px du haut de ma page web.
Quand l'utilisateur scroll et que la div atteint 300px de haut, j'aimerais qu'elle soit "fixed" (qu'elle arrête de scroller).
En fouillant le web, je suis arrivé à ça :
Dans mon header :
window.onscroll = function()
{
if( window.XMLHttpRequest ) { // IE 6 doesn't implement position fixed nicely...
if (document.documentElement.scrollTop > 600 || self.pageYOffset > 600) {
$('#content_sub').css('position', 'fixed');
$('#content_sub').css('top', '300');
} else if (document.documentElement.scrollTop < 600 || self.pageYOffset < 600) {
$('#content_sub').css('position', 'absolute');
$('#content_sub').css('top', '600px');
}
}
}<div style="position: absolute; top: 600px;" id="content_sub" class="sidebar4">
<p>Je voudrais que ce bloc ne passe pas sur mon footer. Comment définir une ordonnée max ?</p>
<p>Merci !</p>
<p>[email protected]</p>
</div>Code : Tout sélectionner
.sidebar4{
width:212px;
height:206px;
background-color:#38A1FA;
left:50%;
margin-left:193px;
z-index: 3;
}Voilà la source du code (vous y trouverez aussi un exemple de ce que je veux, le robot en haut à droite) :
http://www.derekallard.com/blog/post/co ... ky-sidebar
Et une version beta (juste pour visionner la chose) :
http://www.pushaune.com/beta/article-test.html
Une piste ?
Merci d'avance !