Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Объясните с scrollTop, .offset().top (https://javascript.ru/forum/jquery/48986-obyasnite-s-scrolltop-offset-top.html)

cha0s 24.07.2014 14:04

Объясните с scrollTop, .offset().top
 
Такая тема на главной странице есть плавные переходы при клике по ссылке

$(function() {
    $('.page-scroll a').bind('click', function(event) {
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500, 'easeInOutExpo');
        event.preventDefault();
    });
});


Все отлично работает, .offset().top определяет правильно! Но как я делаю такую возможность в модальном окне

$(function() {
    $('.center-block .myb').bind('click', function(event) { // my hrefs
        var $anchor = $(this);
        $('#myModal3').stop().animate({ //ID modal window
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500, 'easeInOutExpo');
        event.preventDefault();
    });
});


то .offset().top начинает глючить и давать левые позиции... в чем магия? первый вариант на главной работает, а в модальном окне он кидает на ошибочные места(не там где стоят ссылки).

Pavel M. 24.07.2014 15:22

А во втором варианте у элемента '.center-block .myb' есть атрибут 'href' ??

cha0s 24.07.2014 15:35

<a class="btn btn-custom btn-lg myb" href="#history">OUR HISTORY</a>


да класс этот на <a весит во всех случаях :)

Pavel M. 24.07.2014 16:10

а элемент с id='history' тоже есть ?

cha0s 24.07.2014 19:16

да само собой=)

<a id="history"></a>


вообщем я так полагаю может какие-то конфликты среди подключенных плагинов, если такого быть не должно.... хотя странно то что на главной работает все так как надо, а вот на модальном хрень какая-то(

ixth 24.07.2014 21:31

Ты скроллишь #myModal3, а offset().top берешь у документа. Может, в том проблема? По js коду много не нагадаешь, дай ссылку на страницу или jsfiddle.

cha0s 25.07.2014 00:08

тут как-бы уже видно по части

$('#myModal3').stop().animate({ //ID modal window
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500, 'easeInOutExpo');


что работа идет непосредственно с #myModal3 а offset уже на href этого линка, у какого документа еще?=) в чем разница? а как мне надо брать правильно этот offset?

BETEPAH 25.07.2014 10:19

cha0s,
offset().top - это расстояние от верха документа.
http://stackoverflow.com/questions/6...ery-offset-top


Часовой пояс GMT +3, время: 19:54.