原始样式：（大家注意滚动条的变化）
代码如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> < 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-1.3.1.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 >
|
相关推荐
Vue自定义组件实现文本框根据文本内容自适应高度的效果，解决若输入文本量或显示文本量超过指定行数后，会出现垂直滚动条，但在IE环境下，该滚动条是隐藏的问题。
在html网页中，我们都知道大篇幅的长文章会占据网页的大部分空间，影响了整体网站页面的美观性和阅读体验，因此，在html网页中添加一个带有滚动条的文本框，就可以很好地解决上述问题。网页滚动条本身就是浏览器的一...
仿微信文本框，自动换行，动态高度，最大四行后滚动。 js监听textarea实时变化值，将textarea内容插入到一个和textarea相同大小的div中，且各属性相同，高度除外；之后将根据div的高度来给textarea的高度赋值，超出...
兼容IE/Firefox/Opera/Safari/Chrom 可定义滚动变化间隔值，支持整数、浮点数 双击恢复初始值 仅3.92K，压缩后2.67K 代码 代码如下: /* * cutePsWheel JS * Description:A js liabary which control the text type ...
04067引用设定了允许滚动区域的单元格区域 04068引用指定了左上角和右下角的单元格区域（之一） 04069引用指定了左上角和右下角的单元格区域（之二） 04070引用指定了左上角和右下角的单元格区域（之三） 04071引用...
3.16 文本框滚动导航 3.17 按钮获取焦点 3.18 文本框获取焦点弹出下拉框 3.19 文本框简单的单击效果 3.20 文字的打字效果 3.21 文字滚动 3.22 文字滑动 3.23 文字跳动特效 3.24 荧光效果的文本 3.25 文字逐个闪亮-...
3.16 文本框滚动导航 3.17 按钮获取焦点 3.18 文本框获取焦点弹出下拉框 3.19 文本框简单的单击效果 3.20 文字的打字效果 3.21 文字滚动 3.22 文字滑动 3.23 文字跳动特效 3.24 荧光效果的文本 3.25 文字逐个闪亮-...
前言 本文介绍的是Android如何实现数字跳动效果的TextView，主要运用了DancingNumberView，DancingNumberView是一个用于跳动显示文本中数字的控件，继承自TextView，这种控件一般用于显示金额等对用户较为敏感的...
3.2 带滚动提示的链接 36 3.3 动态变换的链接 37 3.4 滚动链接 38 3.5 不断闪动的链接 39 3.6 在按钮上定时显示不同的链接 40 3.7 带链接的滚动字幕 42 3.8 单击链接显示菜单 43 3.9 鼠标右键链接 44 3.10 ...
js技巧收集(200多个）文本框焦点问题、网页按钮的特殊颜色、鼠标移入移出时颜色变化、平面输入框、使文字上下滚动、状态栏显示该页状态等
JavaScript+jQuery 网页特效设计 jQuery事件基础 1、jQuery事件概述 jQuery对JavaScript操作...当滚动条发生变化时触发 resize() 当调整浏览器窗口大小时触发 2、事件的绑定 bind() 方法：可以向被选元素添加一个或多
1.文本框焦点问题.2网页按钮的特殊颜色3.鼠标移入移出时颜色变化4.平面按钮5.按钮颜色变化6.平面输入框7.使窗口变成指定的大小8.使文字上下滚动9.状态栏显示该页状态 可以在鼠标移到文字上时就触发事件 传递该object...
创建一个简单的调色板程序，程序界面中可以利用滚动条进行红、绿、蓝三种颜色分量值的调整，也可以直接在文本框中输入红、绿、蓝三种颜色分量值，在颜色分量值调整变化的同时，变化的颜色效果通过一个圆形色块进行现...
39．5 跟踪参数选项变量变化 39．6 扩充参数选项包 第40章 绑定的用户界面 40．1 联合工作的列表框对 40．2 编辑界面 40．3 保存和加载绑定 第六部分 c语言编程 第41章 c和tcl 41．1 利用tclc库函数 41．2 ...
11.jquery浮动变化的个性菜单插件floatmenu下载 12.jQuery黑色风格仿Flash版下滑菜单效果 13.jquery黑色循环滚动菜单特效插件下载 14.jquery灰色简洁风格横向三级网站导航菜单 15.jquery简洁动感支持三级的...