прокрутить содержимое страницы в пользовательскую позицию при прокрутке мыши

0

Я хочу прокручивать содержимое страницы на прокрутке мыши. У меня есть 5 изображений на странице, одновременно я хочу показать одно изображение на экране. Если я прокручиваю вниз, показано второе изображение, если нужно прокрутить предыдущее изображение. Как мудрый до последнего изображения. Я попробовал пример, но понятия не имею, как добиться этого.

JavaScript:

var winHeight = $(window).height();
var prevHeight = 0;
var scrollCount = 0;
var docHeight = $(document).height();

$(document).ready(function(){

  $(window).scroll(function(e){
    console.log("in scroll top");
    var top = $(window).scrollTop();
    console.log("top - "+top);
    if(top !=0 && top != docHeight){
      if(top > prevHeight){
        scrollCount = scrollCount+1;
      }else{
        scrollCount = scrollCount-1;
      }
      console.log("scroll count="+scrollCount);
      $(window).scrollTop(winHeight*scrollCount);
      prevHeight = top;
      if(scrollCount < 0){
        scrollCount = 0;
      }
      e.preventDefault();
    } 
  });

Мой пример здесь http://jsbin.com/iwOsiFIY/1/

1 ответ

0

Просто установите поля для того, что вы хотите, чтобы они были для каждого изображения в CSS. Или обходным путем является добавление кучи "р" тегов в HTML без добавления абзаца, первый способ - лучший. Возможно, вам понадобится JavaScript для изменения размера.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню