Bob*_*obB 9 javascript jquery modal-dialog twitter-bootstrap-3
我有一个模态窗口,需要能够打开模态,然后将用户滚动到模态中的特定位置.我用ajax到php脚本获取模态内容.
例如mypage.php?loc = someid
在php脚本中我有这个js来做滚动:
$( document ).ready(function() {
$('.modal-body').animate({
scrollTop: $("#<?php echo $_GET['loc'];?>").offset().top
}, 1000);
});
Run Code Online (Sandbox Code Playgroud)
在PHP页面是一些像这样的HTML:
<div id="someid"></div>
Run Code Online (Sandbox Code Playgroud)
我的内容正确加载,但发生的滚动量似乎是相对于打开模式的链接,所以它实际上并没有在文档中找到div.我猜我的js需要一点点调整.
我似乎需要能够从模态内容的顶部计算元素的偏移量.
我可以通过设置我正在滚动的元素的值来伪造这个.但我真的需要一种计算方法来计算它.显然,如图所示,不同的设备将无法正常工作.
$( document ).ready(function() {
$('.modal-body').animate({
scrollTop: $("#<?php echo $_GET['loc'];?>").attr('distance')
}, 1000);
});
//Trying to find out how far this div is from the top of the modal window?
<div id="someid" distance="670"></div>
Run Code Online (Sandbox Code Playgroud)
谢谢任何有良好解决方案的人!
所以我找到了解决方案:
$( document ).ready(function() {
$('.modal-body').animate({
scrollTop: $("#<?php echo $_GET['loc'];?>").offset().top
}, 1000);
});
Run Code Online (Sandbox Code Playgroud)
用户找到了解决方案,但似乎没有添加它,因此为了完整起见,这里是
$( document ).ready(function() {
setTimeout(function() {
var $el = $("#<?php echo $_GET['loc'];?>")
var elpos = $el.position();
$('.modal-body').animate({
scrollTop: elpos.top
}, 1000);
},500);
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
4945 次 |
| 最近记录: |