Fullpage js hiệu ứng trượt?

Question

Tôi đang cố gắng sử dụng Fullpage.js. Đây là tập lệnh của tôi:

<div id="fullpage" style="margin-top: 55px"> 
    <div class="section" id="first" style="background-color: red">Some section - Home</div> 
    <div class="section" id="services" style="background-color: blue">Some section - Services</div> 
    <div class="section" id="why" style="background-color: green">Some section - Why</div> 
    <div class="section" id="portofolio" style="background-color: red">Some section - Portofolio</div> 
    <div class="section" id="price" style="background-color: blue">Some section - Price</div> 
</div> 

<script type="text/javascript"> 
    $(document).ready(function() { 

$('#fullpage').fullpage({ 
    menu: '#navbarNav', 
    css3: true, 
    scrollingSpeed: 1000 
}); 
}); 
</script> 

Vấn đề là, không có hiệu ứng trượt trong trang HTML của tôi. Bất kỳ giải pháp? Tôi không thấy bất kỳ lỗi nào trong bảng điều khiển trình duyệt của mình.

CẬP NHẬT

Có một vấn đề thứ hai, Khi tôi di chuyển đến phần ngẫu nhiên sau đó tôi bấm menu, neo không hoạt động, ý tôi là nó giữ ở phần mà tôi di chuyển.

Answer 1

Bạn cần phải xác định neo của bạn trong kịch bản của bạn, như thế này:

$(document).ready(function() { 
    $('#fullpage').fullpage({ 
     menu: '#navbarNav', 
     css3: true, 
     scrollingSpeed: 1000, 
     anchors:['first, 'secondPage', 'why', 'portofolio', 'price'] 
    }); 
}; 

Nguồn: https://github.com/alvarotrigo/fullPage.js#fullpagejs

Answer 2

vui lòng, bạn có thể chèn mã javascript của mình vào bên trong $(document).ready() để đảm bảo rằng mã đã sẵn sàng để thực thi hay không. Trong trường hợp của bạn, nó phải giống như sau:

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('#fullpage').fullpage({ 
      menu: '#navbarNav', 
      css3: true, 
      scrollingSpeed: 1000 
     }); 
     }; 
    </script> 

Hy vọng điều này có thể giải quyết được sự cố của bạn. Cảm ơn bạn

Answer 3

Bạn cần phải viết ID trên thuộc tính neo href như thế này

<ul id=#menu> 
    <li data-menuanchor="first" class="active"> 
    <a href="#first">First</a> 
    </li> 
    <li data-menuanchor="services" class="active"> 
    <a href="#services">Services</a> 
    </li> 
</ul>