使用bootstrap-modal modalOverflow检测滚动事件?

时间:2013-09-14 07:59:58

标签: javascript jquery html css twitter-bootstrap

我的模态中有一些日期选择器的工具提示。如何检测溢出模态是否已滚动,以便我可以重新定位任何打开的浮动元素并根据模态滚动位置重新定位它们? THX

window.scroll没有开火!

这里有一个例子:长模态(页面底部) http://jschr.github.io/bootstrap-modal/

4 个答案:

答案 0 :(得分:6)

好的,我把它分类了。 scroll事件不会传播到DOM的文档级别,因此$(document).on不起作用。 我用这个黑客来解决它。

做了工作。

$(document).on("shown", "#modalcontact", function() {
    $(".modal-scrollable").unbind("scroll");
    $(".modal-scrollable").scroll(function(){
        //do stuff
    });
});

没有工作。

$("#modalcontact").modal({
    shown: function (){
        $(".modal-scrollable").scroll(function(){
            //do stuff
        });     
    }
});

没有工作。

$(document).on("scroll", ".modal-scrollable", function(){
    //do stuff
});

答案 1 :(得分:2)

你已经回答了自己的问题,但我想补充说它也是这样的:

$("#modalcontact").modal().on('loaded.bs.modal', function(){
   $(this).parents('.modal-scrollable').scroll(function(){
      //Do stuff
   });
});

我很难设法使用显示的事件,但这是因为内容是远程加载的。

答案 2 :(得分:0)

尝试

$(document).on('scroll', '.modal-scrollable', function(){
//your code here
});

滚动事件处理程序不仅可以绑定到窗口。

答案 3 :(得分:0)

这对我有用,而早期的答案并不是出于某种原因。但是我使用代码打开模态窗口,这样我就可以在显示内容之前用内容动态填充它。

 $('#modalcontact').modal('show');

 $(".modal-scrollable").unbind("scroll");
 $(".modal-scrollable").scroll(function () {
    $('body').append('Hey hey hey!');
 });