Алексей М.
1 сообщение
#6 лет назад
Ребята, всем привет. Я новичок в JS.  Вообщем есть код, который отлично работал в Fiddle (онлайн редактор js)
Но не работал в html.. Не мог понять почему.  Я ковырялся дня 2, по форумам искал ответы. 
Потом вдруг он перестал и в редакторе работать. 

Суть когда в том, что бы срабатывало однократно аудио при скролинге до определенного дива с классом "elem"
Вот собственно код:

[code][list=1]
  • [list=1]
  • <html>

  • <head>

  •  <meta charset="utf-8">

  •  <meta name="viewport" content="width=device-width">

  •  <title>JS Bin</title>

  • </head>

  • <body>

  • <script src="https://code.jquery.com/jquery-3.0.0.js"></script>



  • <div style="height: 130vh;width: 100%;background: #111;" ></div>

  • <div style="height: 100px;width: 100%;background: #ccc;" class="elem"></div>

  • <div style="height: 600px;width: 100%;background: #111;" ></div>

  • </body>

  • </html> [/list][/list][/code]

    А вот JS:

    [code][list=1]
  • [list=1]
  • var fired = false;

  • var target = $('.elem');

  • var targetPos = target.offset().top;

  • var winHeight = $(window).height();

  • var scrollToElem = targetPos - winHeight;

  • $(window).scroll(function(){

  •  var winScrollTop = $(this).scrollTop();

  •  if(winScrollTop > scrollToElem && fired === false){

  •   var audio = new Audio(';);

  • audio.play();fired = true;

  •  }

  • });[/list][/list][/code]

    Надеюсь на вашу помощь. Спасибо не равнодушным! 
    Дмитрий Щ.
    133 сообщения
    #6 лет назад
    Рекомендуем вам разместить соответствующий проект в сервисе.