I want to know how can you determine if an object has slide in the basic slider? I am wanting to pause a video if a slider has occured but do not know how to determine if the slide has happened?
UPDATE:
The code below displays how I display a jwplayer in galleria slider. But issue is that it only displays a black square. No slider or video player appears and I do want to use jwplayer for this:
<?php
//start:procedure video
if(count($arrVideoFile[$key]) > 1){
?>
<style>
#galleriavideo_<?php echo $key; ?>{ width: 500px; height: 300px; background: #000 }
</style>
<div id="galleriavideo_<?php echo $key; ?>">
<?php
foreach ($arrVideoFile[$key] as $v) { ?>
<div id="myElement-<?php echo $key.'-'.$i; ?>">Loading the player...
<script type="text/javascript">
jwplayer("myElement-<?php echo $key.'-'.$i; ?>").setup({
file: "<?php echo 'VideoFiles/'.$v; ?>",
width: 480,
height: 270
});
<?php $i++; ?>
</script>
</div>
<?php } ?>
</div>
<script type="text/javascript">
Galleria.loadTheme('jquery/classic/galleria.classic.min.js');
Galleria.run('#galleriavideo_<?php echo $key; ?>');
</script>
<?php
}
The slider you chose does not seem to be able to handle events. Maybe you should choose another plugin ? For example Galleria has that possibility. Check Documentation => Events
, particularly image
.
In case you want to stay with the basic slider, you could change the code to add what you want when a slide is shown. More info here: jQuery event to trigger action when a div is made visible
Another solution would be to use the jQuery Watch plugin and detect when the display
attribute changes.
Personally, I think the first solution is the easiest :)