cute.slider实现三维幻灯片翻转过渡效果代码
代码语言:html
所属分类:幻灯片
代码描述:cute.slider实现三维幻灯片翻转过渡效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<style>
/* Div */
body {
margin: 0;
color: #555;
min-width: 320px;
-webkit-text-size-adjust: 100%;
background-color: #eeeeee;
font-family: "微软雅黑";
font-size: 14px;
line-height: 20px;
}
img {
border-style: none;
vertical-align: top;
max-width: 100%;
height: auto;
}
a {
text-decoration: none;
color: #333;
}
a:hover {
color: #ff7700;
text-decoration: none;
}
.c-860 {
max-width: 800px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
padding-top: 100px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 10px;
}
.c-demoslider {
margin: 0px auto;
}
/* Slider */
#layerslider-wrapper {
position: relative;
}
#layerslider-wrapper .ls-shadow-top {
position: absolute;
background-image: url(//repo.bfw.wiki/bfwrepo/images/huodong/huandeng/shadow-top.png);
background-repeat: no-repeat;
background-position: top center;
height: 42px;
width: 100%;
top: 0;
z-index: 1;
}
#layerslider-wrapper .ls-shadow-bottom {
position: absolute;
background-image: url(//repo.bfw.wiki/bfwrepo/images/huodong/huandeng/shadow-bottom.png);
background-repeat: no-repeat;
background-position: bottom center;
height: 32px;.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0