jquery控制上下滚动

效果：例如一个框体内有三个功能1.点击向上翻滚：按钮2.翻滚内容3.点击向下翻滚：按钮如果“翻滚内容”里的内容超出其高度有隐藏，则“点击向下翻滚”和“点击向上翻滚”有效果... 效果：
例如一个框体内有三个功能
1.点击向上翻滚：按钮
2.翻滚内容
3.点击向下翻滚：按钮
如果“翻滚内容”里的内容超出其高度有隐藏，则“点击向下翻滚”和“点击向上翻滚”有效果，翻到底则“点击向上翻滚”为红色，反之“点击向下翻滚”为红色。
大概就是这样，求代码！展开

 我来答

1个回答

#热议# 生活中有哪些实用的心理学知识？

驻云客
推荐于2016-04-21 · TA获得超过977个赞

知道小有建树答主

回答量：577

采纳率：0%

帮助的人：340万

我也去答题访问个人页

关注

展开全部

已经测试过没有问题,我用的是JQ1.7版本,直接代码COPY过去就行.

<html>
<head>
<style type="text/css">
    #parent{
        height:100px;width:200px;overflow: hidden;border:1px solid #000;
    }
    #parent div input{
        position: absolute;z-index:1;height:20px;width:200px;
    }
    #inner{
        margin: 20px 0px;
    }
</style>
<script type="text/javascript" src="js/jquery-1.7.js"></script>
<script type="text/javascript" >
    $(function(){
        var up=$("#parent input").eq(0);
        var down=$("#parent input").eq(1);
        var inner=$("#inner");
        up.click(function(){
            if(parseInt(inner.css("marginTop"))<parseInt($("#parent").css("height"))-parseInt(inner.css("height"))+20){
                up.attr("disabled","disabled").css("color","red");;
            }else{
                down.removeAttr("disabled").css("color","#000");
                inner.css("marginTop","-=12px");
            }
        });
        down.css("top","90px").click(function(){
            if(parseInt(inner.css("marginTop"))>=20){
                down.attr("disabled","disabled").css("color","red");;
            }else{
                up.removeAttr("disabled").css("color","#000");;
                inner.css("marginTop","+=12px");
            }
        });
        
    });
</script>
</head>
<body>
<div id=parent>
    <div><input type=button value="up" ></div>
        <div id="inner">12334534554<br/>
        645567567567568<br/>
        6786789789gfhdf<br/>
        ghdfghdfghdfghdfg<br/>
        12334534554<br/>
        645567567567568<br/>
        6786789789gfhdf<br/>
        ghdfghdfghdfghdfg<br/>
        12334534554<br/>
        645567567567568<br/>
        6786789789gfhdf<br/>
        ghdfghdfghdfghdfg<br/>
        12334534554<br/>
        645567567567568<br/>
        6786789789gfhdf<br/>
        ghdfghdfghdfghdfg<br/>
        12334534554<br/>
        645567567567568<br/>
        </div>
    <div><input type=button value="down"></div>
</div>
</body>
</html>


本回答被提问者采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

jquery控制上下滚动

其他类似问题

为你推荐：