Jquery隐藏显示ScrollTop

Jquery Hide Show ScrollTop

本文关键字:ScrollTop 显示 隐藏 Jquery      更新时间:2023-09-26

我正在寻找一种在向下滚动时显示div的子级的方法。

这是我的代码:

$(document).ready(function (e) {
    var test = 0;
    $('#one').children('div').hide().css({
        'overflow': 'hidden'
    });
    $('#one').hover(function () {
        $(this).children('div').stop(true, true).show('slow');
    }, function () {
        $(this).children('div').stop(true, true).hide('slow');
    });

当我向下滚动两次(~30像素)时,我想显示div子项,这样当用户再次到达屏幕顶部时,他可以看到div子项

if ($(window).scrollTop() >11) {
        test+=1;
    }
if(test!==0){
    $('#one').children('div').show().css({
       'overflow': 'visible'
    });

似乎不起作用。我希望这个技巧在不修改鼠标悬停功能的情况下发挥作用。

这里是jsfiddle,以便更好地理解。

DEMO

试试这个

 $(document).ready(function (e) {
    var test = 0;
    $('#one').children('div').hide().css({
        'overflow': 'hidden'
    });
    $('#one').hover(function () {
        $(this).children('div').stop(true, true).show('slow');
    }, function () {
        $(this).children('div').stop(true, true).hide('slow');
    });
});
$(window).scroll(function(event) {
    if ($(window).scrollTop() >11) {
     $('#one').children('div').stop(true,true).show();
    }
});

希望这能有所帮助,谢谢