文本域滚动条变化

最新推荐文章于 2022-07-06 21:29:02 发布

javaScript小主

最新推荐文章于 2022-07-06 21:29:02 发布

阅读量274

点赞数

本文链接：https://blog.csdn.net/qq_45683093/article/details/103170642

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script type="text/javascript" src="jss/jquery-1.3.2.min.js"></script>
		<title>文本域的滚动条高度变化</title>
	</head>
	<body>
		<div class="messsge">
			<div class="msg_top">
				<input type="button"value="向上"id="upBtn"/>&nbsp;&nbsp;<input type="button"value="向下"id="downBtn"/>
			</div>
			<div class="tt">
				<textarea id="content"rows="4"cols="35">
					肖战 王一博 王俊凯 王源 易烊千玺
					肖战 王一博 王俊凯 王源 易烊千玺
					肖战 王一博 王俊凯 王源 易烊千玺
					肖战 王一博 王俊凯 王源 易烊千玺
					肖战 王一博 王俊凯 王源 易烊千玺
					肖战 王一博 王俊凯 王源 易烊千玺
				</textarea>
			</div>
		</div>
		<script>
			$(document).ready(function(){
				var $content=$("#content");                       //获取文本域对象
				$("#upBtn").click(function(){                     //向上按钮的单击事件
					if(!$content.is(":animated")){                //是否处于动画中
						if($content.height()<350){
							$content.animate({scrollTop:"-=40"},500);
						}
					}
				})
			$("#downBtn").click(function(){                       //向下按钮的单击事件
				if(!$content.is(":animated")){                    //是否处于动画中
					if($content.height()>40){
						$content.animate({scrollTop:"+=40"},500);
					}
				}
			})
			})
		</script>
	</body>
<html>

javaScript小主

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
文本域滚动条变化

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <script type="text/javascript" src="jss/jquery-1.3.2.min.js"></script> <title>文本域的滚动条高度变化</titl...
复制链接

扫一扫