求写一个js能动态添加 删除css中的 高度
例如.a{width:100px;height：30px;}意思是我设了一个按钮点击下在.a{width:100px;height：30px;}删除高度变成.a{widt...
例如.a{width:100px;height：30px;} 意思是 我设了一个按钮 点击下 在.a{width:100px;height：30px;} 删除高度 变成 .a{width:100px; } 再次点击该按钮在增加 高度变回.a{width:100px;height：30px;}
求大神 表达不清再问我 展开
求大神 表达不清再问我 展开
5个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>demo</title>
<style type="text/css">
*{margin:0;padding:0;}
.box{width:300px;height:30px;background:#da251a;}
.click1{width:120px;height:30px;line-height:30px;text-align:center;color:#fff;background:#000;margin-bottom:10px; cursor:pointer;}
.click2{width:120px;height:30px;line-height:30px;text-align:center;color:#fff;background:#000;cursor:pointer;}
</style>
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
$(".click1").click(function(){
var bHeight=$(".box").height();
bHeight+=30;
$(".box").css("height",bHeight);
});
$(".click2").click(function(){
var bHeight=$(".box").height();
bHeight-=30;
$(".box").css("height",bHeight);
});
})
</script>
</head>
<body>
<div class="click1">增加</div>
<div class="click2">减少</div>
<div class="box"></div>
</body>
</html>
自己把对应的jq库文件引入下即可。
写的不好，请谅解！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
$(function(){
$('button').click(function(){
if($('div').hasClass('t')) $('div').removeClass('t').addClass('t1');
else $('div').removeClass('t1').addClass('t')
})
})
</script>
<style>
.t{
height:30px;
width:100px;
border:1px solid blue;
}
.t1{
width:100px;
border:1px solid blue;
}
</style>
</head>
<body>
<button>切换</button>
<div class="t"></div>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你说的功能我只能分开做，比如单击一个按钮删除高度，再点击另一个按钮添加高度，如果你要用一个按钮做这个功能的话就传个值过去，比如传个int，那边判断奇偶性做判断做出相对应的动作
假设一个div 他的ID="aa"
<input type=“text” onChlick="dd(1)" value="更改">
funcation dd(index)
{
if(index=1)
{
document.getElementById("aa").style.height=0;
}
if(index=2)
{
document.getElementById("aa").style.height=30px;
}
}
大致差不多，可能些细别的小错误你自己要改一下
假设一个div 他的ID="aa"
<input type=“text” onChlick="dd(1)" value="更改">
funcation dd(index)
{
if(index=1)
{
document.getElementById("aa").style.height=0;
}
if(index=2)
{
document.getElementById("aa").style.height=30px;
}
}
大致差不多，可能些细别的小错误你自己要改一下
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你可以这样，设置一个b{height:30px} 然后不给a设置height 就只需要添加或者删除
class名字b的样式了
$(".btn").on("click",function(){
if($("a").hasClass("b")){
$("a").removeClass("b");
}else{
$("a").addClass("b");
}
})
class名字b的样式了
$(".btn").on("click",function(){
if($("a").hasClass("b")){
$("a").removeClass("b");
}else{
$("a").addClass("b");
}
})
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
假设你那个按钮的id="zoomBtn"；你可以用jquery这样写代码
<script type="text/javascript">
$(document).ready(function(){
$(".zoomBtn").click(function(){
if($(".a").css("height")) {
$(".a").css("height", "");
} else {
$(".a").css("height", "30px");
}
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$(".zoomBtn").click(function(){
if($(".a").css("height")) {
$(".a").css("height", "");
} else {
$(".a").css("height", "30px");
}
});
});
</script>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
