When a slide comes into view, I would like to trigger an event, for example when we get to slide 2, a pop-up appears. I've tried a variety of jquery plug-ins with no success. In all my attempts the pop-up appears when the slides are initially loaded by the browser.
Here is my attempt using jquery.appear
---
title: "XXXX"
output: ioslides_presentation
---
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://morr.github.io/javascripts/jquery.appear.js"></script>
## Slide 1
Nothing to see here
## Slide 2
<div id="pop"></div>
<script type="text/javascript">
$('#pop').appear(alert("Hi"));
</script>
I've also tried selectors such as, #pop:visible and .current #pop
IOSlides puts an object in your window namespace called slidedeck that can be used to programmatically control the deck. One approach might be to monitor the current slide, and run your code when it changes.
var curSlide = -1;
window.setInterval(function() {
if (curSlide != window.slidedeck.curSlide_) {
curSlide = window.slidedeck.curSlide_;
if (curSlide == 1) {
// code to run when slide 2 appears goes here (curSlide_is 0-based)
} else if (curSlide == 2) {
// code to run when slide 3 appears goes here
}
}
}, 100)
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加