Я использую jQuery на своем сайте и хочу запускать определенные действия, когда определенный элемент div становится видимым.
Можно ли прикрепить какой-то «видимый» обработчик событий к произвольным div и запустить определенный код, когда div станет видимым?
Я хотел бы что-то вроде следующего псевдокода:
$(function() {
$('#contentDiv').isvisible(function() {
alert("do something");
});
});
Код предупреждения («сделай что-нибудь») не должен срабатывать до тех пор, пока contentDiv не станет видимым.
Спасибо.
Решение проблемы
Проблема решается наблюдателями мутаций DOM. Они позволяют привязать наблюдателя (функцию) к событиям изменения содержимого, текста или атрибутов элементов dom.
С выпуском IE11 все основные браузеры поддерживают эту функцию, см. http://caniuse.com/mutationobserver.
Пример кода выглядит следующим образом:
$(function() {
$('#show').click(function() {
$('#testdiv').show();
});
var observer = new MutationObserver(function(mutations) {
alert('Attributes changed!');
});
var target = document.querySelector('#testdiv');
observer.observe(target, {
attributes: true
});
});<div id="testdiv" style="display:none;">hidden</div>
<button id="show">Show hidden div</button>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
Комментариев нет:
Отправить комментарий