Popcorn.js и jQuery
Есть ли способ нацеливаться на элементы Popcorn.js, используя jQuery. Пример: у меня есть это ниже как метод с div в текстовой области. Я добавляю интервал закрытия, чтобы попытаться закрыть родительский div, если человек не хочет ждать 8 секунд, пока элемент не закроется. Это в моем script.js
example.popupFootnote({ "id": "footnote",
"start": 2,
"end": 10,
"target": "footnotes",
"title": "Tear Gas",
"text": '<div id="exampleBox"><span style="float:right; margin-right:10px">Close Window</span><a href="http://en.wikipedia.org/wiki/Tear_gas">Tear gas</a>, formally known as a lachrymatory agent or lachrymator (from lacrima meaning "a tear" in Latin), is a non-lethal chemical compound that stimulates the corneal nerves in the eyes to cause tearing, pain, and even blindness. Common lachrymators include OC, CS, CR, CN, nonivamide, bromoacetone, phenacyl bromide, xylyl bromide and syn-propanethial-S-oxide (from onions). Lacrymators often share the structural element Z=C-C-X, where Z indicates carbon or oxygen, and X indicates bromide or chloride.</div>',
top: '10%',
left: '70%'
});`
Поэтому я не хочу, чтобы щелкнул элемент closeWindow, а затем закрылся родительский элемент.
это в моем index.html ниже моего script.js в HTML между тегами script.
$(document).ready(function () {
$('#closeWindow').click(function () {
$(this).parent().parent().hide();
});
});
Элементы HTML расположены следующим образом:
<div id="movieHolder">
<div id="video" style="width: 750px; height: 422px;" ></div>
<div id="overlayDiv"></div>
<div id="overlayDiv-Map"></div>
<div id="footnotes"></div>
</div>
1 ответ
Чтобы сделать это, вам нужно использовать делегирование событий или новый метод-обработчик событий jQuery Live, вот пример: http://jsfiddle.net/bcmoney/PTJ4w/(отсканируйте до 25 секунд, чтобы всплыла сноска попкорна)
Вы были довольно близки, но на самом деле забыли поставить:
<span id="closeWindow" style="float:right; margin-right:10px">Close Window</span>
Также может потребоваться переместить встроенный CSS во внешнюю таблицу стилей или, по крайней мере, в заголовок, но я уверен, что вы это знаете.
Наконец, jQuery будет изменен на следующее:
$(document).ready(function () {
$('#closeWindow').live("click", function () {
$(this).parent().parent().hide();
});
});