Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Скрол к выпадающему DIV (https://javascript.ru/forum/dom-window/64062-skrol-k-vypadayushhemu-div.html)

ooosmileooo 18.07.2016 13:31

Скрол к выпадающему DIV
 
Всем привет.
У меня есть такой код:

<div class="view-sour"><a href="#" data-index="1" style="
    border: 5px solid #55555d;
    border-radius: 30px;
    display: inline-block;
    margin: 7px 0px 0px 0px;
    background: url(http://www.potolkoff.in.ua/wp-content/uploads/2016/07/swirl_pattern.png);
    color: black;
    width: 100%;
    height: 200px;
    padding-top: 58px;
    font-size: 33px;
">Матовые</a>
<div class="mm1">
<h1><b>Матовые</b></h1>
<h4 style="text-align: center;">Подходит для ценителей классики. Благодаря матовому полотну, можно получить ярко-белый, идеально ровный потолок без швов и шероховатостей.</h4>[envira-gallery id="83"]
<h3><b style="color: black; font-size: 21px;">Понравился такой потолок? Рассчитай и закажи звонок!</b></h3>
<a class="btn_m1" href="#section-10" target="_self">Рассчитать</a></div>
</div>


Таких блоков у меня 7 штук. Есть скрипт:

jQuery(function(){
    jQuery('.view-sour .mm1').hide();
    $a = jQuery('.view-sour > a');
    $a.on('click', function(event) {
      event.preventDefault();
      $a.not(this).next().slideUp(500);
      $a.not(this).removeClass('open');
      jQuery(this).next().slideToggle(500);
      jQuery(this).toggleClass('open');
      if(jQuery(this).hasClass('open')) {
       jQuery('html, body').animate({
         scrollTop: jQuery(this).offset().top - 63 + 'px'
     }, 2000);
     return false;
      }
    });
});


Проблема в том, что не правильно работает скролл. Я хочу, что бы после нажатия на див, автоматически скролилось к диву внутреннего блока. а что-то не выходит(
Вот сайт, кому интересно: potolkoff.in.ua

рони 18.07.2016 13:52

ooosmileooo,
jQuery(function() {
    jQuery(".view-sour .mm1").hide();
    $a = jQuery(".view-sour > a");
    $a.on("click", function(event) {
        event.preventDefault();
        var self = this;
        $a.not(this).next().slideUp(500);
        $a.not(this).removeClass("open");
        jQuery(this).next().slideToggle(500, function() {
            jQuery(self).hasClass("open") && (self = this);
            jQuery("html, body").animate({
                scrollTop: jQuery(self).offset().top - 70 + "px"
            }, 2E3)
        });
        jQuery(this).toggleClass("open")
    })
});

ooosmileooo 18.07.2016 14:25

Спасибо огромное) Именно это нужно было) Спасибо))))


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