fullpage.js在鼠标经过幻灯片分页器上幻灯片停止左右滚动,鼠标移开幻灯片
鼠标划动
* {margin:0; padding:0; }
body {background-color:#333;}
.initBody {height:100%; overflow:hidden; position: relative; z-index:100;}
ul,li {list-style:none;}
a {text-decoration:none; color:red;}
.section {background-color:#f1f1f1; font-size: 100px; line-height:200px; text-align: center;}
.section_1 {background-color:red}
.section_2 {background-color:blue}
.section_3 {background-color:green}
/*
.page {width:15px; position: fixed; right:20px; top:0; color:#fff; z-index: 999;}
.page li a {display:block; }
.page li span{display:block; width:15px; height:15px; border-radius:50%; background:rgba(255,255,255,.5); background-color: #fff; text-indent:-9999em; margin-top: 5px; cursor: pointer;}
.page li.active span {border:1px solid #fff; width:13px; height:13px; background:blue;}
*/
.page { position: fixed; right: 20px; top: 40%; z-index: 10; list-style-type: none; }
.page li { width: 90px; height: 27px; margin-top: 7px; overflow: hidden;}
.page a { display: block; height: 27px; padding-right: 30px; line-height: 27px;/*background:rgba(255,255,255,.5);*/background: url(public/images/dot.png) right -34px no-repeat; color: #fff; text-align: right; text-shadow: 1px 1px 0px #333; text-decoration: none; overflow: hidden;}
.page span { display: block; width: 60px; height: 27px; font-size: 12px; text-indent: 200px; opacity: 0.6; filter:alpha(opacity=60); overflow: hidden;}
.page a:hover span { text-indent: 0;}
.page .active a { background-position: right 0;}
.wheel {background-color:#336699;}
.wrapper {overflow: hidden;}
#box{position: fixed; right:50%; top:0; color:#fff; z-index: 999;font-size: 100px; }
555555555555
Slide 1
Slide 2
https://alvarotrigo.com/fullPage/examples/autoHeight.html#3rdPage
Slide 3
视图二
视图三
视图四
视图五
视图六 |
免责声明:本内容仅代表回答者见解不代表本站观点,请谨慎对待。
版权声明:作者保留权利,不代表本站立场。
|
|
|
|
|
|
|