我想创建一个 div,当单击它时,会弹出另一个 div 并向下滚动到它。 Here这是我的看法,但它不起作用。正确的做法是什么?
html
<div class="image">
<img src="https://dotcms.com/contentAsset/image/47ffbc9c-f224-47a2-ba6c- 0fedb202dbe9/diagram1/filter/Scale/scale_w/500/scale_h/800">
</div>
<div id="box" style="display:none;"></div>
jquery
$(document).ready(function() {
$('.image').click(function() {
$('#box').slideToggle("fast");
$('html, body').animate({
scrollTop: $('#box').offset().top
}, 2000);
});
});
最佳答案
尝试 scrollIntoView()
$(document).ready(function() {
$('.image').click(function() {
$("#box").show()
$('#box').get(0).scrollIntoView()
});
});
#box{background-color:#000;height:100px;display:block;width:100%;}
.mage{display:block;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="image">
<img src="https://dotcms.com/contentAsset/image/47ffbc9c-f224-47a2-ba6c-0fedb202dbe9/diagram1/filter/Scale/scale_w/500/scale_h/800">
</div>
<div id="box" style="display:none;">
</div>
关于javascript - 单击时显示 div 并向下滚动到它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34469796/