Hi there,
This is in regards to the awesome Anything Slider : http://css-tricks.com/examples/AnythingSlider/
I am looking for a way to put video files into each slide of the Anything Slider, and then each time an arrow is clicked, the video of the current slide stops playing, to make way for the next slide’s video. This way I can have a video player on each slide, and prevent from multiple videos playing "off screen" as the slides are scrolled through.
I’m new to coding, so a bit of research online led me to Flowplayer (http://flowplayer.org/) – the reason being is that it you can use simple javascript to stop or start the player. So I thought that this could be added to the "jquery.anythingslider.js" file within the arrow function, so that when the arrow is clicked, the video will stop.
I’ve got to grips with putting Flowplayer on my site and it works fine on any part of the website, except for when I place it into the <li> elements of the Anything Slider. When I do this, the audio plays fine, but the video doesn’t show. Here is what my code looks like:
Code:
I also have this line of code in my head tag to call upon the javascript for the player:
I’d really, really appreciate it if you could let me know why this happens, and how to fix it. It’s driving me crazey – but then again it’s probably because I’m new to coding.
Also if you can think of a better way of acheiving what I’m trying to do, that would be even better!
Thanks for your time
Owen
