Как использовать одну и ту же функцию прокрутки jQuery для нескольких элементов

Question

У меня есть функция прокрутки, которая показывает элемент «прокрутки вверх», когда пользователь прокручивает до 160 пикселей, при нажатии этого элемента страница прокручивается вверху страницы.

Я хочу использовать эту функцию для создания дополнительных кнопок прокрутки, которые будут отображаться на разных этапах документа и прокручиваются до разных областей.

Например, когда пользователь прокручивает до 400 пикселей вниз, появляется элемент «next», когда при нажатии на него прокручивается страница 300px вниз, они получают до 900px сверху, появляется новый элемент прокрутки, который при нажатии прокручивается до 1300px и т. Д. ,

здесь код JQuery У меня есть:

$(document).ready(function(){ 

$(window).scroll(function(){ 
    if ($(this).scrollTop() > 160) { 
     $('.scrollToTop').fadeIn(); 
    } else { 
     $('.scrollToTop').fadeOut(); 
    } 

}); 

$('.scrollToTop').click(function(){ 
    $('html, body').animate({scrollTop : 0},800); 
    return false; 
}); 
}); 

HTML:

<div class="scrollToTop-container"> 
<a href="#" class="scrollToTop"><img src="img/icon_arrow_up.png" width="24" height="24" />  <br/>Scroll to top</a> 
</div> 

я надеюсь, что это еще не слишком запутанным.

Благодаря

Answer 1

Может быть, вы можете использовать функцию, как это я сделал повторное использование некоторые части кода:

function scroll(id,show,limit,timeout){ 
    $(window).scroll(function(){ 
    if ($(this).scrollTop() > show) { 
     $(id).fadeIn(); 
    } else { 
     $(id).fadeOut(); 
    } 
}); 
$(id).click(function(){ 
    $('html, body').animate({scrollTop : limit},timeout); 
    return false; 
}); 
} 

, а затем использовать его как это:

scroll(".scrollToTop",160,0,800); 

где первый параметр это класс или идентификатор, на который вы хотите повлиять, во-вторых, позиция элемента на определенной высоте (сверху), третья - предел (где вы хотите прокрутить вверх), а последний - это продолжительность animate функция.

---

EDIT: Вы можете также хотел бы остановиться на конкретных пикселей, а не только прокручивать вверх, поэтому я изменил функцию, чтобы установить позицию scrollTop по вашему желанию.