jQuery 实现新闻列表上下来回滚动

jQuery 实现新闻列表上下来回滚动

实现效果如图,来来回滚动,也可手动上下滚动

xiaoguo

js 代码

<code>
/*/public/js/web/v2021/view/news/newsdynamic.js*/
$(document).ready(function(e) {
    stopscroll=false;
    $('.list').hover(function(){stopscroll=true},function(){stopscroll=false});
    var up=true;
    setInterval(function(){
        if(stopscroll){return false;}
        if(up&&$('.list').scrollTop()<$('.list li').outerHeight()*($('.list li').length-12)){
            $('.list').scrollTop($('.newsdynamic .list').scrollTop()+1);
        }else{
            up=false;
            $('.list').scrollTop($('.list').scrollTop()-1);
            if($('.list').scrollTop()==0){
                up=true;    
            }
        }
    },30);
});
</code>

Css代码

<code>
.list {
    width: 500px;
    height: 456px;
    overflow: auto;
    margin-right: -20px;
    padding-right: 20px;
}
</code>

html代码


<code>
<div class="list">
    <li>111111111111111111111</li>
    <li>222222222222222222222</li>
    <li>333333333333333333333</li>
    <li>?????????????????????</li>
</div>
</code>

90 thoughts on “jQuery 实现新闻列表上下来回滚动
  1. Zaim-online 2023/10/31 05:37  7

    Вы устали от стандартных предложений микрофинансовых организаций и хотите что-то новое? Хотите быть в курсе всех актуальных новинок и выгодных предложений? Тогда наша платформа именно для вас! Мы предлагаем новые займы онлайн на карту, которые сделают вашу жизнь проще и комфортнее.

    Что мы можем предложить:

    Большие суммы займа для новых и постоянных клиентов.
    Лучшие ставки и условия на рынке.
    Индивидуальные программы лояльности с бонусами и подарками.
    Постоянное обновление ассортимента финансовых продуктов.

    С нашей платформой вы всегда будете в курсе последних тенденций в мире микрофинансирования. Не упустите шанс воспользоваться нашими уникальными и выгодными предложениями!

Comments are closed.

添加一条新回复 回到顶部

亲爱的,主人已经关闭了这篇文章的评论 。