如图红色div是我要显示内容的部分,当内容很多时候,我原本是让此div有滚动条,但是后来效果不好看,后来我把上面加上可上下调整的按钮,我有两个问题。一:如何当li(我用li显示每条的内容)数量多超过div高度时候如何判断,div高度只能定死的;二:问题一解决后,我想让鼠标放在向下的按钮,li就会自动下移,就向平时拖动滚动条一样平滑,向上同样,有什么好方法实现。谢谢各位大牛们。

解决方案 »

  1.   

    打开看了下,不是,我比如
    <div style="border:1px solid red height:300px">高度定死
    <ul>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li>
    <li><input type="checkbox" .... />名称:..价格:..  + 数量 -</li></ul>
    </div>
      

  2.   

    楼主说的那种应该要用JS才能实现.
    我想到一个办法.不知行不行
    1先将DIV溢出设为隐藏,这样,超过DIV高度的就会看不见.
    2 将要显示的LI内容统统放在marquee滚动标答内面,设置滚动速度为0
    3,鼠标放在向下的按钮,发生JS事件,设置marquee滚动标答,向下滚动,并设置滚动速度这样子,应该可以吧,我也没试过,突然想出来的
      

  3.   

    既然高是固定的 那你把li放个固定高的层里 这样你判断循环多少次就知道它什么时候超过那个层的高度了,点击按钮时也可以控制循环的次数来增加一个li层
      

  4.   


    <!--记得导入jquery库-->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <style type="text/css">
        body{text-align:center;}
        div{height:200px;width:200px;border:1px solid red;overflow:hidden;}
        ul{list-style:none;margin:0px;padding:0px;}
        li{width:200px;line-height:20px;font-size:14px;}
    </style>
    <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            var content = $("#content");
            var ofheight=content.height();
            var i=0;
            $("#down").click(function(){
                content.scrollTop(content.scrollTop()+ofheight);
                i++;
                var scroll = ofheight*i;
                if(scroll-content.scrollTop()>0){
                    $(this).attr("disabled",true);
                }
                $("#up").attr("disabled","");
            })
            $("#up").click(function(){
                content.scrollTop(content.scrollTop()-ofheight);
                i--;
                if(content.scrollTop()<=0){
                    $(this).attr("disabled",true);
                    i=0;
                }
                $("#down").attr("disabled","");
            })
        })
    </script>
    </head>
    <body>
        <input id="up" type="button" value="向上查看"/>
    <div id="content">
        <ul>
            <li>乞丐绝非“高收入群体”</li>
            <li>曾经有一位媒体人,因为看到“乞丐年薪十万”的新</li>
            <li>闻,心里不服,便卧底陪同乞讨,亲身体验“高收入行</li>
            <li>业”。然而,他选择的这三位“全市知名乞丐”却颇不给力:</li>
            <li>这三位分别被媒体曝光过的行乞者,最终的收成分别为23.73</li>
            <li>元、65.75元和不足17元。</li>
            <li>而欲达到“十万年薪”的标准,需要每天收入274元方</li>
            <li>可,显而易见,这三位“知名乞丐”离这个标准还差得很远。</li>
            <li>。“乞丐收入比白领高”“年薪十万”之</li>
            <li>类的谣言也就不攻自破了。</li>
            <li>乞丐绝非“高收入群体”</li>
            <li>曾经有一位媒体人,因为看到“乞丐年薪十万”的新</li>
            <li>闻,心里不服,便卧底陪同乞讨,亲身体验“高收入行</li>
            <li>业”。然而,他选择的这三位“全市知名乞丐”却颇不给力:</li>
            <li>这三位分别被媒体曝光过的行乞者,最终的收成分别为23.73</li>
            <li>元、65.75元和不足17元。</li>
            <li>而欲达到“十万年薪”的标准,需要每天收入274元方</li>
            <li>可,显而易见,这三位“知名乞丐”离这个标准还差得很远。</li>
            <li>。“乞丐收入比白领高”“年薪十万”之</li>
            <li>类的谣言也就不攻自破了。</li>
        </ul>
    </div> 
        <input id="down" type="button" value="向下查看" />
    </body>
    </html>