<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<style type="text/css">

* { margin:0; padding:0;font:normal 12px/17px Arial; }

.msg {width:300px; margin:100px; }

.msg_caption { width:100%; overflow:hidden; margin-bottom:1px;}

.msg_caption span { display:block; float:left; margin:0 2px; padding:4px 10px; background:#898989; cursor:pointer;color:white; }

.msg textarea{ width:300px; height:80px;height:100px;border:1px solid #000;}

</style>

 <!--   引入jQuery -->

<script src="../../scripts/jquery.js" type="text/javascript"></script>

 <script type="text/javascript">

    $(function(){

        var $comment = $('#comment');//获取评论框

        $('.up').click(function(){ //向上按钮绑定单击事件

           if(!$comment.is(":animated")){//判断是否处于动画

                $comment.animate({ scrollTop  : "-=50" } , 400);

            }

        })

        $('.down').click(function(){//向下按钮绑定单击事件

           if(!$comment.is(":animated")){

                $comment.animate({ scrollTop  : "+=50" } , 400);   //文本框上下动

            }

        });

    });

  </script>

</head>

<body>

<form action="" method="post">

<div class="msg">

    <div class="msg_caption">

        <span class="up" >向上</span>

        <span class="down" >向下</span>

    </div>

    <div>

        <textarea id="comment" rows="8" cols="20">多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化.多行文本框高度变化</textarea>

    </div>

</div>

</form>

</body>

</html>

jquery 实现文本框scroll上下动的更多相关文章

  1. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  2. jquery获取文本框的内容

    使用jquery获取文本框的内容有以下几种: 1.根据ID取值(id属性): // javascript <script type="text/javascript"> ...

  3. jQuery清除文本框，内容并设置不可用

    JQuery清除文本框,内容并设置不可用  如果是设置只读,则将disabled换成readonly function CleanText(textid) { $("#"+text ...

  4. 用Jquery控制文本框只能输入数字和字母

    用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...

  5. JQuery 限制文本框只能输入数字和小数点

    $(function(){ /*JQuery 限制文本框只能输入数字*/ $(".NumText").keyup(function(){ $(this).val($(this).v ...

  6. JQuery限制文本框只能输入数字和小数点的方法

    <input type="text" class="txt NumText"  Width="100px"  /> $(func ...

  7. jQuery限制文本框的输入长度

    jQuery限制文本框输入,包含粘贴. //限制文本框的输入长度 $(function () { $(document).on("keypress", ".txt-val ...

  8. jQuery监控文本框事件并作相应处理的方法

    本文实例讲述了jQuery监控文本框事件并作相应处理的方法.分享给大家供大家参考.具体如下: //事情委托 $(document)  .on('input propertychange', '#que ...

  9. 使用jQuery为文本框、单选框、多选框、下拉框、下拉多选框设值及返回值的处理

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Maximum Subarray——LeetCode

    Find the contiguous subarray within an array (containing at least one number) which has the largest ...

  2. 动态规划——数位dp

    通过先前在<动态规划——背包问题>中关于动态规划的初探,我们其实可以看到,动态规划其实不是像凸包.扩展欧几里得等是具体的算法,而是一种在解决问题中决策的思想.在不同的题目中,我们都需要根据 ...

  3. Java 热部署深入探索

    简介 在 Java 开发领域,热部署一直是一个难以解决的问题,目前的 Java 虚拟机只能实现方法体的修改热部署,对于整个类的结构修改,仍然需要重启虚拟机,对类重新加载才能完成更新操作.对于某些大型的 ...

  4. A - Til the Cows Come Home

    裸的最短路,试一下刚看的spfa,虽然没有看代码,不过明白了大致的思想,先写一下试试吧,而且是个稀疏图,应该会很快吧. SPFA 算法采用图的存储结构是邻接表,方法是动态优化逼近法.算法中设立了一个先 ...

  5. Struts2获取request三种方法

    Struts2获取request三种方法   struts2里面有三种方法可以获取request,最好使用ServletRequestAware接口通过IOC机制注入Request对象. 在Actio ...

  6. 最近新出的C++右值引用的意思

    看了一下这种方法的介绍,个人感觉,右值引用,更像人类的思想了,有些将编译前与编译后结合紧密的感觉. 左值引用是变量名的别名,右值引用是值的别名,也就是不将值赋给一个变量名所在的地址,直接将值所在的初始 ...

  7. PHP安全编程：shell命令注入(转)

    使用系统命令是一项危险的操作,尤其在你试图使用远程数据来构造要执行的命令时更是如此.如果使用了被污染数据,命令注入漏洞就产生了. exec()是用于执行shell命令的函数.它返回执行并返回命令输出的 ...

  8. 自定义控件（视图）2期笔记09：自定义视图之继承自ViewGroup（仿ViewPager效果案例）

    1. 这里我们继承已有ViewGroup实现自定义控件,模拟出来ViewPager的效果,如下: (1)实现的效果图如下: (2)实现步骤: • 自定义view继承viewGroup • 重写onLa ...

  9. TCP/IP协议原理与应用笔记06：OSI参考模型全称

    1. ISO是一个组织,OSI是一个模型. 2. OSI不是协议,是网络体系结构的概念模型 3. OSI参考模型全称为: Open System Interconnection Reference M ...

  10. vim中选择匹配文本删除技巧

    试举几例如下: 如何只保留匹配内容行而删除其他行? :v/pattern/d :help :v 如何对每行只保留匹配内容而删除这一行中的其它内容 :%s/^.pattern.$/\1/g 删除包含特定 ...