Search code examples
jqueryjquery-slider

how to determine if a slide has been triggered in a jquery slider


http://basic-slider.com/

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

            }

Solution

  • 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 :)