<html>
<title>无标题文档</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" >
var $comment=$("#comment");
$(function(){
$("#bigger").click(function(){
if(!$comment.is(":animated")){
if($comment.height<500)
{
$comment.animate({height: "+50"},400);
}
}
});
$("#smaller").click(function(){
if(!$comment.is(":animated")){
if($comment.height>50)
{
$comment.animate({height: "-50"},400);
}
}
});
});
</script>
<style type="text/css">
textarea{
width:300px;
height:100px;
border:1px solid;
}
</style>
</head><body>
<form >
<input type="button" value="放大" id="bigger"/>
<input type="button" value="缩小" id="smaller"/><br/>
<textarea rows="8" cols="20" id="comment">
</textarea>
</form>
</body>
</html>
<title>无标题文档</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" >
var $comment=$("#comment");
$(function(){
$("#bigger").click(function(){
if(!$comment.is(":animated")){
if($comment.height<500)
{
$comment.animate({height: "+50"},400);
}
}
});
$("#smaller").click(function(){
if(!$comment.is(":animated")){
if($comment.height>50)
{
$comment.animate({height: "-50"},400);
}
}
});
});
</script>
<style type="text/css">
textarea{
width:300px;
height:100px;
border:1px solid;
}
</style>
</head><body>
<form >
<input type="button" value="放大" id="bigger"/>
<input type="button" value="缩小" id="smaller"/><br/>
<textarea rows="8" cols="20" id="comment">
</textarea>
</form>
</body>
</html>
$(function(){
var $comment=$("#comment");//变量放进来
$("#bigger").click(function(){
if(!$comment.is(":animated")){
if($comment.height()<500){//是height(),少了括号
$comment.animate({height: "+=50"},400);//是+=50,才会自增50高度,下面的也一样
}
}
});
$("#smaller").click(function(){
if(!$comment.is(":animated")){
if($comment.height()>50){
$comment.animate({height: "-=50"},400);
}
}
});
});
</script>
if(!$comment.is(":animated")){
可以写成
if($comment.not(":animated")){
1)if(!$comment.is(":animated")){}这个函数要怎么理解呢?
2)为什么他的滚动条在缩小放大的过程中总是消失出现呢?
嘿嘿~~谢谢
$comment.is(":animated")这是jquery中用来判断当前对象是否正在执行动画的,如果是返回true,否则返回false
加上了!,也就是结定条件为:当前对象目前没有在执行动画时,执行以下操作。以避免动画动作重复
等值于:if($comment.not(":animated")){//这句就直白点,就是$comment没有在执行动画时,执行以下操作2)为什么他的滚动条在缩小放大的过程中总是消失出现呢?
也不是总是消失出现吧。只是动画开始时消失,动画结束时恢复;因为当前动画正在增加它的高度吧,如果设置样式 style="overflow:hidden" 时就看不到滚动条了