jquery根据鼠标移动方向控制动画方向
代码语言:html
所属分类:悬停
代码描述:jquery根据鼠标移动方向控制动画方向
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<style>
.indThr {
width: 100%;
height: 100%;
margin: 0;
}
.kcList {
width: 18.8rem;
height: 100%;
margin: 0 auto;
}
.picList {
width: 100%;
height: 4.56rem;
margin: 0;
padding: 0;
}
.picList li {
width: 32.66%;
height: 100%;
float: left;
margin-right: 1%;
overflow: hidden;
margin-bottom: 1%;
}
.picList li:nth-child(3n) {
margin-right: 0;
}
.meng {
width: 100%;
height: 100%;
display: block;
}
.da-thumbs li a,
.da-thumbs li a img {
display: block;
position: relative
}
.da-thumbs li a {
overflow: hidden
}
.da-thumbs li a div {
position: absolute;
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
width: 100%;
height: 100%;
overflow: hidden;
opacity: .8;
filter: alpha(opacity=80);
text-align: center;
line-height: 4.56rem;
font-size: 0.6rem;
color: #fff;
font-family: "Medium";
}
.da-thumbs li a div.da-an.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0