-1

这听起来很简单，但我似乎无法让它发挥作用。

我试图让我的列表只有当用户悬停在它上面时才有滚动效果。

当我将鼠标悬停在列表上方时，类不会改变，滚动条也不会出现。

我有以下css类和脚本

CSS

    .business_update_old{font-size:11px;max-height:300px}
    .no_scroll{overflow:hidden}
    .scroll{overflow:auto}

脚本

    $('.business_update_old').hover(function(){
       $(this).removeClass("no_scroll");    
       $(this).addClass("scroll");
    });

PHP

    :
    :
    echo '<div class="business_update_old no_scroll">';
    echo '<ul class="business_updates_new"></ul>';
    :
    foreach(...

如果有人可以在这里提供任何帮助，我们会很高兴。谢谢。赞赏

4

2 回答 2

1

这个小提琴显示它工作。

首先，您需要确保有足够的内容来填充 300px 高的 div，就像我在小提琴中所做的那样。

此外，为了确保滚动条不会停留，您需要使用这个 jQuery

$('.business_update_old').hover(
function() {
    $this = $(this);
    $this.removeClass("no_scroll")
    $this.addClass("scroll")
}, function() {
    $this.removeClass("scroll")
    $this.addClass("no_scroll");
});​

或者，你可以只用 CSS 来做这件事，完全不需要 jQuery。

如果你像这样设置你的 CSS

.business_update_old {
    font-size:11px;
    max-height:300px;
    overflow: hidden;
}
.business_update_old:hover {
    overflow:auto;
}

然后它也将起作用。看到这个小提琴。

于 2012-05-15T13:40:24.833 回答
1

很简单：

$('.business_update_old').hover(
    function(){
        $(this).removeClass('no_scroll').addClass('scroll');
    }, function() {
        $(this).removeClass('scroll').addClass('no_scroll');
    }
);​

如有疑问，请查看文档。

干杯

于 2012-05-15T18:59:24.897 回答