I have a number of tooltips a date pickers used in my modal. How can I detect if the overflow modal has been scrolled so I can either reposition any open floating elements and reposition them according to the modal scroll position? Thx
window.scroll is not firing!
An example of this is available here: Long modals (bottom of page) http://jschr.github.io/bootstrap-modal/
OK, I sorted it. The scroll event doesn't propagate to the document level of the DOM so $(document).on
doesn't work. I got around it with this hack.
This did work.
$(document).on("shown", "#modalcontact", function() {
$(".modal-scrollable").unbind("scroll");
$(".modal-scrollable").scroll(function(){
//do stuff
});
});
This didn't work.
$("#modalcontact").modal({
shown: function (){
$(".modal-scrollable").scroll(function(){
//do stuff
});
}
});
This didn't work.
$(document).on("scroll", ".modal-scrollable", function(){
//do stuff
});
You already answered your own question, but I would add that it's working this way as well:
$("#modalcontact").modal().on('loaded.bs.modal', function(){
$(this).parents('.modal-scrollable').scroll(function(){
//Do stuff
});
});
I've struggled to manage to work with shown event, but it was because the content was loaded remotely.
Try
$(document).on('scroll', '.modal-scrollable', function(){
//your code here
});
The scroll event handler can be bound to more than just the window.
This worked for me, whereas the earlier answers didn't for some reason. But I am opening the modal window using code, so that I can dynamically fill it with content before it is shown.
$('#modalcontact').modal('show');
$(".modal-scrollable").unbind("scroll");
$(".modal-scrollable").scroll(function () {
$('body').append('Hey hey hey!');
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.