使用jquery的toggle实现DIV的隐藏和显示,但是无法用按钮控制,请问该如何写?
#div2{width:300px;height:30px;position:fixed;left:-260px;bottom:0;z-index:9;backgroun...
#div2{
width:300px;
height:30px;
position:fixed;
left:-260px;
bottom:0;
z-index:9;
background-color:#33CCFF;
}
#div2 #btn3{
width:40px;
float:right;
background-color:#99FF33;
}
HTML如下:
<div id="div2">这是一个可伸缩的DIV<div id="btn3">伸缩</div></div>
JQ控制代码如下:
$("btn3").click(function(){$("#div2").toggle(
function(){
$(this).animate({left:0},300);
},
function(){
$(this).animate({left:-260},300);
}
)})
但是为什么出的效果不是点btn3控制div2的隐藏和显示,鼠标在div2的任何位置都可以隐藏?? 展开
width:300px;
height:30px;
position:fixed;
left:-260px;
bottom:0;
z-index:9;
background-color:#33CCFF;
}
#div2 #btn3{
width:40px;
float:right;
background-color:#99FF33;
}
HTML如下:
<div id="div2">这是一个可伸缩的DIV<div id="btn3">伸缩</div></div>
JQ控制代码如下:
$("btn3").click(function(){$("#div2").toggle(
function(){
$(this).animate({left:0},300);
},
function(){
$(this).animate({left:-260},300);
}
)})
但是为什么出的效果不是点btn3控制div2的隐藏和显示,鼠标在div2的任何位置都可以隐藏?? 展开
3个回答
展开全部
$("#btn3").toggle(
function(){
$("#div2").animate({left:0},300);
友蠢 },
function(){
$("#div2").animate({left:-260},300);
}
);
toggle(fn,fn)方法的使用好竖陪方法:每次点击后依次调用函数。如果点击了一个匹配的元素,纤念则触发指定的第一个函数,第二次点击同一元素时,则触发指定的第二个函数,如果有更多函数,则需再次点击。
展开全部
// 点击div2,进行切换显示,隐藏
$("#div2").toggle(
function(){
档基 $(this).animate({left:0},300);
},
function(){
$(this).animate({left:-260},300);
});
// 竖世点击btn3控制
$("btn3").click(function(){
if($("#div2").css("display")=="none") {
$("#div2").css("display","block");
} else {
$("#div2").css("display","none");
余蠢肢}
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
不知道你用的是jquery哪个版本的?1.9版本 .toggle()方法删除
追问
1.4.2
追答
e晴天nl给的答案正确!
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询