level 1
sarior
楼主
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>d</title>
<meta name="viewport" content="width=320.1,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<script src="js/jquery-1.10.2.min.js"></script>
</head>
<style>
.move{
width:100px;
height:100px;
transition: all .2s linear;
background-color:#000
}
button{
width:100px;
height:50px;
}
.close{
transform: translate(42px,-76px) scale(0);
}
.open{
transform: translate(0,0) scale(1);
}
</style>
<body>
<button class="b1">关闭</button>
<button class="b2">打开</button>
</body>
<script>
$(".b1").click(function(){
$(".move").removeClass("open");
$(".move").addClass("close");
})
$(".b2").click(function(){
if($("body").find(".move").length == 0){
$("body").append("<div class='move'></div>")
$(".move").removeClass("close");
$(".move").addClass("open");
}
$(".move").removeClass("close");
$(".move").addClass("open");
})
</script>
</html>
请问 我点B2的时候 第一次 加载不到样式 之后就可以了 怎么解决第一次加载样式这问题?
2015年08月07日 02点08分
1
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>d</title>
<meta name="viewport" content="width=320.1,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
<script src="js/jquery-1.10.2.min.js"></script>
</head>
<style>
.move{
width:100px;
height:100px;
transition: all .2s linear;
background-color:#000
}
button{
width:100px;
height:50px;
}
.close{
transform: translate(42px,-76px) scale(0);
}
.open{
transform: translate(0,0) scale(1);
}
</style>
<body>
<button class="b1">关闭</button>
<button class="b2">打开</button>
</body>
<script>
$(".b1").click(function(){
$(".move").removeClass("open");
$(".move").addClass("close");
})
$(".b2").click(function(){
if($("body").find(".move").length == 0){
$("body").append("<div class='move'></div>")
$(".move").removeClass("close");
$(".move").addClass("open");
}
$(".move").removeClass("close");
$(".move").addClass("open");
})
</script>
</html>
请问 我点B2的时候 第一次 加载不到样式 之后就可以了 怎么解决第一次加载样式这问题?