Jquery slideUp bottom page

Question

手风琴有问题。 我有一个地方，用户可以在它上面（在我的页面底部），并滚动内容。我的问题是：一切工作正常，但我必须手动滚动查看滚动的内容。 我不知道该怎么办。我已经尝试切换而不是slideUp，创建一个“推”分区..但它不好。

看到我的代码如下。

$(document).ready(function() { 
 
    $('.accordeon').hide(); // hide the content of .accordeon 
 
    $('h4').click(function() { // when clic on h4 
 
    $(this).next('div:hidden').slideDown() // roll the div 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 

 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a mauris et nulla facilisis eleifend. Sed metus orci, vulputate sit amet malesuada id, luctus vestibulum lacus. Sed faucibus, nibh vel faucibus porta, lectus lacus suscipit metus, ut posuere nulla dolor porttitor erat. Nam iaculis dolor et est tristique scelerisque. Integer gravida scelerisque est, ut pellentesque sem facilisis in. Quisque felis elit, laoreet id sagittis non, sollicitudin vitae turpis. Pellentesque quis quam sed nibh sollicitudin porttitor non ac sapien. Cras luctus egestas urna, vitae bibendum enim malesuada ut. Nulla porta tempus mi vel consequat. Aenean scelerisque porttitor felis, id elementum erat porttitor eu. Mauris vitae elit non lorem malesuada viverra non ac eros.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a mauris et nulla facilisis eleifend. Sed metus orci, vulputate sit amet malesuada id, luctus vestibulum lacus. Sed faucibus, nibh vel faucibus porta, lectus lacus suscipit metus, ut posuere nulla dolor porttitor erat. Nam iaculis dolor et est tristique scelerisque. Integer gravida scelerisque est, ut pellentesque sem facilisis in. Quisque felis elit, laoreet id sagittis non, sollicitudin vitae turpis. Pellentesque quis quam sed nibh sollicitudin porttitor non ac sapien. Cras luctus egestas urna, vitae bibendum enim malesuada ut. Nulla porta tempus mi vel consequat. Aenean scelerisque porttitor felis, id elementum erat porttitor eu. Mauris vitae elit non lorem malesuada viverra non ac eros.</p> 
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean a mauris et nulla facilisis eleifend. Sed metus orci, vulputate sit amet malesuada id, luctus vestibulum lacus. Sed faucibus, nibh vel faucibus porta, lectus lacus suscipit metus, ut posuere nulla dolor porttitor erat. Nam iaculis dolor et est tristique scelerisque. Integer gravida scelerisque est, ut pellentesque sem facilisis in. Quisque felis elit, laoreet id sagittis non, sollicitudin vitae turpis. Pellentesque quis quam sed nibh sollicitudin porttitor non ac sapien. Cras luctus egestas urna, vitae bibendum enim malesuada ut. Nulla porta tempus mi vel consequat. Aenean scelerisque porttitor felis, id elementum erat porttitor eu. Mauris vitae elit non lorem malesuada viverra non ac eros.</p> 
 
\t 
 
\t \t \t \t \t 
 
<h4>CLIC HERE</h4> 
 
<div class="accordeon"> 
 
\t <img src="http://2.bp.blogspot.com/-ot4eLEDWAjs/Uk9fzDJlQCI/AAAAAAAAKsU/UfUhYvEvAz4/s1600/Recherche-image-b%C3%A9b%C3%A9-80.jpg" alt="Metz" width="300" height="225" /> 
 
</div>

至页面的底部，集团公司的链接，你可以看到你有滚动看到隐藏的内容。如何自动执行此操作？

我认为最好的解决方案是“当我在我的div上改变页面的位置”，但我不知道如何。

有人已经有这个问题吗？

非常感谢大家！

Answer 1

使页面在幻灯片功能之后滚动到元素的顶部。试试这个：

$(document).ready(function() { 
     $('.accordeon').hide(); // hide the content of .accordeon 
     $('h4').click(function() { // when clic on h4 
      $(".accordeon").slideToggle(function() { 
       $('html, body').animate({ 
        scrollTop: $(this).offset().top 
       }, 500); 
      }); 
     }); 
    }); 

Answer 2

如果您将id与div关联，则可以使用JQuery滚动到它。

Click here了解更多来自Peter Ajtai的答案。