web-dev-qa-db-fra.com

Afficher/masquer Div au défilement

J'ai un div qui se trouve au bas d'un diaporama et que je souhaite supprimer lorsque l'utilisateur fait défiler la liste ou utilise la flèche bas puis réapparaît lorsque l'utilisateur revient au début Je suppose que cela intègre la fonctionnalité de défilement JQuery?

jqueryscrollshow-hide
7
Dan
<div>
    <div class="a">
        A
    </div>

</div>​


$(window).scroll(function() {

    if ($(this).scrollTop()>0)
     {
        $('.a').fadeOut();
     }
    else
     {
      $('.a').fadeIn();
     }
 });

Échantillon

51
Priyank Patel
$(window).scroll(function () {
  var Bottom = $(window).height() + $(window).scrollTop() >= $(document).height();
if(Bottom )
{
$('#div').hide();
}
});
2
Arun Killu

Voici ma réponse lorsque vous souhaitez l'animer et commencer à l'aplanir au bout de quelques secondes. J'ai utilisé l'opacité parce que tout d'abord, je ne voulais pas le faire disparaître complètement. 

$(window).scroll(function () {
    var elem = $('div');
    setTimeout(function() {
        elem.css({"opacity":"0.2","transition":"2s"});
    },4000);            
    elem.css({"opacity":"1","transition":"1s"});    
});
1
DragonKnight

Essayez ce code

$('window').scrollDown(function(){$(#div).hide()});

$('window').scrollUp(function(){ $(#div).show() });
1
Madhavi Mangapati
$.fn.scrollEnd = function(callback, timeout) {          
  $(this).scroll(function(){
    var $this = $(this);
    if ($this.data('scrollTimeout')) {
      clearTimeout($this.data('scrollTimeout'));
    }
    $this.data('scrollTimeout', setTimeout(callback,timeout));
  });
};

$(window).scroll(function(){
    $('.main').fadeOut();
});

$(window).scrollEnd(function(){
    $('.main').fadeIn();
}, 700);

Cela devrait faire l'affaire!

0
Quatban Taco

j'ai une jolie réponse essayez ce code;)

<div id="DivID">
</div>

$("#DivID").scrollview({ direction: 'y' });
$("#DivID > .ui-scrollbar").addClass("ui-scrollbar-visible");
0
user1120073