• 无缝上下滚动轮播图


    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <style>
            *{
                margin:0;
                padding:0;
            }
            #container{
                height:170px;
                500px;
                background:teal;
                margin:200px;
                overflow:hidden;
                position:relative;
            }
            #box{
                position:absolute;
                left:0;
                top:0;
            }
            ul{
                list-style:none;    
            }
        </style>
        <body>
            <div id="container">
                <div id="box">
                    <ul>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油11</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油10</li>
                    </ul>
                    <ul>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油11</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了...</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油1</li>
                        <li>好好学习天天向上,困了累了想想mm,想想sg,加油10</li>
                    </ul>
                </div>
            </div>
        </body>
    </html>
    <script src="../public.js"></script>
    <script>
        var timer = null;
        var num = 0;
        timer = setInterval( function(){
            num--;
            $id("box").style.top = num + "px";
            if( num < -( $id("box").children[0].offsetHeight ) ){
                num = 0;
            }
        },30 )
    </script>
  • 相关阅读:
    WebBrowser.ExecWB的完整说明
    jQuery选择器的灵活用法
    Nooice, 首次开通博客园
    【HDU】3663 Power Stations
    【HDU】4069 Squiggly Sudoku
    【FOJ】2076 SUDOKU
    【HDU】3529 Bomberman Just Search!
    【HDU】3909 Sudoku
    【HDU】2780 SuSuSudoku
    【HDU】3111 Sudoku
  • 原文地址:https://www.cnblogs.com/tis100204/p/10328844.html
Copyright © 2020-2023  润新知