Прокрутка к идентификаторам Div с JQuery

Question

Из-за свойств css мои прокрутки к тегам div имеют слишком много полей. Поэтому я вижу jquery как лучшее решение для исправления этого.

Я не уверен, почему это не работает, я очень новичок в Js и JQuery. Любая помощь нам очень ценится.

Вот краткий обзор Js. Я обнаружил, что, когда ваши DIV идентификаторы в контейнерах, чтобы изменить («HTML, тело») в ('контейнер)

Here is my jsfiddle

 jQuery(document).ready(function($){ 
var prevScrollTop = 0; 
var $scrollDiv = jQuery('div#container'); 
var $currentDiv = $scrollDiv.children('div:first-child'); 

var $sectionid = 1; 
var $numsections = 5; 

$scrollDiv.scroll(function(eventObj) 
{ 
    var curScrollTop = $scrollDiv.scrollTop(); 
    if (prevScrollTop < curScrollTop) 
    { 
    // Scrolling down: 
     if ($sectionid+1 > $numsections) { 
      console.log("End Panel Reached"); 
     } 
     else { 
      $currentDiv = $currentDiv.next().scrollTo(); 
      console.log("down"); 
      console.log($currentDiv); 
      $sectionid=$sectionid+1; 
      console.log($currentDiv.attr('id')); 
      var divid =$currentDiv.attr('id'); 
      jQuery('#container').animate({scrollTop:jQuery('#'+divid).position().top}, 'slow'); 
      } 
    } 
    else if (prevScrollTop > curScrollTop) 
    { 
    // Scrolling up: 
     if ($sectionid-1 == 0) { 
      console.log("Top Panel Reached"); 
     } 
     else { 
      $currentDiv = $currentDiv.prev().scrollTo(); 
      console.log("up"); 
      console.log($currentDiv); 
      $sectionid=$sectionid-1; 
      var divid =$currentDiv.attr('id'); 
      jQuery('html, body').animate({scrollTop:jQuery('#'+divid).position().top}, 'slow'); 

      } 
    } 
    prevScrollTop = curScrollTop; 
}); 
}); 

Answer 1

Я не совсем уверен, что вы хотите, но прокруткой к <div> с jQuery проще, чем ваш код.

Например, этот код заменяет автоматическое поведение прыжки якорей с плавным скроллингом:

$(document).ready(function(e){ 
    $('.side-nav').on('click', 'a', function (e) { 
     var $this = $(this); 
     var top = $($this.attr('href')).offset().top; 

     $('html, body').stop().animate({ 
      scrollTop: top 
     }, 'slow'); 

     e.preventDefault(); 
    }); 
}); 

Вы, конечно, можете настроить переменную top путем добавления или удаления из него нравится:

var top = $($this.attr('href')).offset().top - 10; 

I (в верхней части вашего HTML): http://jsfiddle.net/Qn5hG/8/

Если это не поможет вам или вашему вопрос - это нечто другое, прошу прояснить его!

---

EDIT:

Проблемы с скрипкой:

• JQuery не ссылается
• Вам не нужно jQuery(document).ready() если структура JQuery выбран с "OnLoad". Удалите первую и последнюю строку вашего JavaScript.
• В вашем HTML не существует div#container, поэтому нет причин проверять, где он прокручивается. И событие прокрутки никогда не срабатывает.
• Ваш HTML недопустим. В конце есть много незакрытых элементов и случайных меток. Убедитесь, что это действительно.
• Очень сложно понять, что должна делать ваша скрипка.