level 2
卿ლ打梨花
楼主
<!DOCTYPE html5>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery使用mouseenter和mouseleave实现鼠标经过弹出层且可以点击</title>
<script src="jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<style type="text/css">
.test{
width: 300px;
position: relative;
margin:200px auto;
height: 300px;
background:rgb(0,0,0);
border-top-right-radius: 10px;
}
.trans{
transition:0.4s ease-in-out;
transform:skew(20deg) rotate(360deg) translate(300px) scale(1.5);
}
</style>
<script type="text/javascript">
$(function(){
$("div.test").mouseover(function(){
$("div.test").addClass("trans");
}).mouseout(function(){
$("div.test").removeClass("trans");
})
})
</script>
</head>
<body>
<div class="test">
46546
</div>
</body>
</html>
2014年08月19日 09点08分
1
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery使用mouseenter和mouseleave实现鼠标经过弹出层且可以点击</title>
<script src="jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<style type="text/css">
.test{
width: 300px;
position: relative;
margin:200px auto;
height: 300px;
background:rgb(0,0,0);
border-top-right-radius: 10px;
}
.trans{
transition:0.4s ease-in-out;
transform:skew(20deg) rotate(360deg) translate(300px) scale(1.5);
}
</style>
<script type="text/javascript">
$(function(){
$("div.test").mouseover(function(){
$("div.test").addClass("trans");
}).mouseout(function(){
$("div.test").removeClass("trans");
})
})
</script>
</head>
<body>
<div class="test">
46546
</div>
</body>
</html>
![[真棒]](/static/emoticons/u771fu68d2.png)
