为什么我按照老师的方法把代码写完后,刷新页面第一屏没有动画效果,要滚动到第二屏后,在重新滚动到第一屏才看的到动画效果,这是为什么?求解答这是代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0"/> <title>数据</title> <link rel="stylesheet" href="css/jquery.fullPage.css"> <!-- 初始化 --> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/index.css"> </head> <body> <div id="fullpage"> <!-- 信息 --> <div class="section section1"> <h3>第一屏</h3> <p>数据</p> </div> <!-- 详细信息 --> <div class="section section2"> <h3>第二屏</h3> <p>数据</p> </div> <!-- 知识信息 --> <div class="section section3"> <h3>第三屏</h3> <p>数据</p> </div> <!-- 兴趣爱好--> <div class="section section4"> <h3>第四屏</h3> <p>数据</p> </div> </div> <script src="jquery/jquery-3.1.1.min.js"></script> <script src="jquery/jquery.fullPage.min.js"></script> <script src="jquery/jquery.easing.min.js"></script> <script src="jquery/move.js"></script> <!-- 这是自己写的,我是引用外部文件--> <script src="js/jqfullpage.js"></script> <!-- jqfullpage.js里面是这么写的 -->$(document).ready(function(){ $(function(){ $('#fullpage').fullpage({ verticalCentered: false, anchors: ['page1', 'page2', 'page3', 'page4'], sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', '#f90'], navigation:true, afterLoad:function(Link,index){ switch(index){ case 0: break; case 1: move('.section1 h3').scale(1.5).end(); move('.section1 p').x(300).end(); break; case 2: move('.section2 h3').scale(1.5).end(); move('.section2 p').x(100).end(); break; default: break; } }, onLeave:function(Link,index){ switch(Link){ case 0: break; case 1: move('.section1 h3').scale(.5).end(); move('.section1 p').x(0).end(); break; case 2: move('.section2 h3').scale(1).end(); move('.section2 p').x(0).end(); break; default: break; } }, // afterRender:function(){ // }, }); }); }); </body></html>页面刷新后,第一屏没动画
1 回答
- 1 回答
- 0 关注
- 1158 浏览
添加回答
举报
0/150
提交
取消