Помогите разобраться, пожалуйста. Я в JS/Jquery крайне неопытен, поэтому сам не догоняю, что не так.
Это скрипт на плавный скролл по кнопке "наверх".
$(function(){
$('#goTop').click(function(e){
$('html,body').stop().animate({ scrollTop: $('.nav').offset().top }, 700);
e.preventDefault();
});
});
Это скрипт автоматического медленного скролла.
$(function(){
$('#autoShow').click(function(e){
var stopper = $('#stopAutoshow');
if ($(window).width() < 940) {var showDuration = 48000;} else {var showDuration = 24000;}
$('html,body').stop().animate({ scrollTop: $('.footer').offset().top}, showDuration, 'linear');
e.preventDefault();
stopper.slideToggle();
stopper.click(function(){
$('html,body').stop();
stopper.hide();
});
var target = $('.small');
var targetPos = target.offset().top;
var winHeight = $(window).height();
var scrollToElem = targetPos - winHeight;
$(window).scroll(function(){
var winScrollTop = $(this).scrollTop();
if(winScrollTop > scrollToElem){
stopper.hide();
$('html,body').stop();
}
});
});
});
Вот HTML, если нужно.
<body>
<div class="nav">
<div class="home"><p><a href="index.html">Главная</a></p></div>
<div class="gallery currentPage"><p><a href="gallery.html">Галерея работ</a></p></div>
<div class="contacts"><p><a href="contacts.html">Контакты</a></p></div>
</div>
<script src="js/mobileMenu.js"></script>
<div class="mobileNav" style="display: none">
<div class="menuBtn"><img src="pics/list.png" alt="menuMobile" width="50px" height="50px"></div>
<div class="menuList">
<a href="index.html"><div class="mobHome"><p><img src="pics/homepage.png" alt="Главная" width="25px" height="25px">Главная</p></div></a>
<a href="gallery.html"><div class="mobGallery"><p><img src="pics/gallery.png" alt="Галерея" width="25px" height="25px">Галерея работ</p></div></a>
<a href="contacts.html"><div class="mobContacts"><p><img src="pics/contacts.png" alt="Контакты" width="25px" height="25px">Контакты</p></div></a>
<div class="closeMenu"><img src="pics/closeMenu.png" alt="Закрыть" width="25px" height="25px"></div>
</div>
</div>
<a href="#bottom" id="autoShow">
<div>
<p>Нажмите для автоматической прокрутки</p>
<img src="pics/closeMenu.png" alt="downArrow" width="35px" height="35px">
</div>
</a>
<div id="stopAutoshow"><p>Нажмите, чтобы остановить показ</p></div>
<div class="content">
<img src="pics/photos/6.jpg" alt="шкаф" width="450" height="500">
<img src="pics/photos/5.jpg" alt="стенка" width="450" height="500">
<img src="pics/photos/12.jpg" alt="стол деревянный" width="450" height="500">
<img src="pics/photos/25.jpg" alt="кухонный гарнитур" width="450" height="500">
<img src="pics/photos/10.jpg" alt="кровать" width="450" height="500">
<img src="pics/photos/8.jpg" alt="стеллаж" width="450" height="500">
<img src="pics/photos/1.jpg" alt="шкаф-купе" width="450" height="500">
<img src="pics/photos/2.jpg" alt="шкаф-купе" width="450" height="500">
<img src="pics/photos/13.jpg" alt="тумбочка" width="450" height="500">
<img src="pics/photos/14.jpg" alt="компьютерный стол" width="450" height="500">
<img src="pics/photos/16.jpg" alt="коридорный шкаф" width="450" height="500">
<img src="pics/photos/17.jpg" alt="дверь" width="450" height="500">
<img src="pics/photos/18.jpg" alt="шкаф купе" width="450" height="500">
<img src="pics/photos/19.jpg" alt="шкаф" width="450" height="500">
<img src="pics/photos/21.jpg" alt="полка" width="450" height="500">
<img src="pics/photos/22.jpg" alt="шкаф" width="450" height="500">
<img src="pics/photos/24.jpg" alt="диван и стулья" width="450" height="500">
<img src="pics/photos/26.jpg" alt="шкаф" width="450" height="500">
<img src="pics/photos/27.jpg" alt="photo" width="450" height="500">
<img src="pics/photos/28.jpg" alt="кухня" width="450" height="500">
<img src="pics/photos/29.jpg" alt="полка настенная" width="450" height="500">
<img src="pics/photos/30.jpg" alt="кухонный гарнитур" width="450" height="500">
<img src="pics/photos/31.jpg" alt="столик деревянный" width="450" height="500">
<img src="pics/photos/32.jpg" alt="мебель в магазин" width="450" height="500">
<img src="pics/photos/33.jpg" alt="мебель в магазин" width="450" height="500">
<img src="pics/photos/34.jpg" alt="шкаф-купе" width="450" height="500">
<img src="pics/photos/35.jpg" alt="шкаф" width="450" height="500">
<img src="pics/photos/36.jpg" alt="шкаф" width="450" height="500">
</div>
<div class="goTopLink">
<a href="#top" id="goTop">Наверх</a>
</div>
<a name="bottom"></a>
<div class="footer">
<p>Copyright</p>
<p class="small">Разработчик сайта - тот-то тот-то</p>
<p class="small">Icons made by <a href="https://www.flaticon.com/authors/vectors-market" title="Vectors Market">Vectors Market</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" target="_blank">CC 3.0 BY</a></p>
</div>
<script src="js/lightbox.js"></script>
<script src="js/autoshow.js"></script>
<script src="js/smoothScroll.js"></script>
</body>
