Показать сообщение отдельно
  #6 (permalink)  
Старый 09.07.2017, 07:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Сообщение от Argeares
Так всё равно срабатывает постоянно(

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
       header{
         background-color: hsla(120, 100%, 20%, 1);
         height: 1500px;
       }
       .delivered{
            background-color: hsla(0, 100%, 50%, 1);
            text-align: center;
             font-size: 48px;
       }
       p{
         margin: 0;
         background-color: hsla(120, 100%, 20%, 1);
         height: 1500px;
       }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.js"></script>
  <script>
$(function() {
  var waypoint =  $(".delivered").waypoint(function() {
        $("html,body").stop().animate({
            scrollTop: $("#to-delivered").offset().top
        }, 600);
       waypoint[0].enabled = false ;
    }, {
        offset: "70%"


    })

    $('button.enable').on('click', function() {
  waypoint[0].enabled = true;
})

});
  </script>
</head>

<body>
<header>
<br>
<br>
<br>
<br>
<br>
</header>

<section class="delivered" id="to-delivered">
<br>
<br>
<br>
<br>section
<br>
<br>
<br>
</section>

<p><button class="enable">Enable </button></p>
</body>
</html>
Ответить с цитированием