IrogSinta
asked on
Thumbnail Video Gallery Is Not Clickable Anymore
The following javascript on a simple webpage used to work. It would display a thumbnail gallery at the bottom and when you click on a thumbnail, the corresponding video would play. Now the mouse doesn't even change anymore when you hover over the thumbnails and clicking on them doesn't do anything. I'm not really a javascript coder, I just lifted this code from somewhere else years ago and it worked back then. Let me know if you need any other info.
<script src="javascript/jquery.1.4.js" type="text/javascript"></script>
<script src="javascript/scripts.js" type="text/javascript"></script>
<script src="http://cdn.jquerytools.org/1.2.0/jquery.tools.min.js"></script>
<script>
$(function() {
var nowPlay="The Ops Family - Part 1";
$("p").text(nowPlay);
$(".scrollable").scrollable();
$(".items img").hover(function() {
$("p").text($(this).attr("title"));
}, function() {
$("p").text(nowPlay);
});
$(".items img").click(function() {
// see if same thumb is being clicked
if ($(this).hasClass("active")) { return; }
nowPlay=$(this).attr("title")
var url = "video-files/"+nowPlay+".flv";
LoadPlay(url,'flv')
$(".items img").removeClass("active");
$(this).addClass("active");
// when page loads simulate a "click" on the first image
});
});
</script>
why not posting a link to your page to get a quick help on the issue?
ASKER
Sorry but it's an intranet page so it's not accessible to the public.
ok, it's a bit difficult....
the "Anymore" mean the code was not so bad so the issue may be in the page
the "Anymore" mean the code was not so bad so the issue may be in the page
.flv file required specific codec, also you are probably using a flash script as Flash is no longer supported ...
you can try to convert your video to these format instead of .flv
and use a script like this https://videojs.com/ or plain html5
https://www.w3schools.com/html/html5_video.asp
you can try to convert your video to these format instead of .flv
<source src="video1.mp4" type="video/mp4">
<source src="video1.ogg" type="video/ogg">
<source src="video1.webm" type="video/webm">
and use a script like this https://videojs.com/ or plain html5
https://www.w3schools.com/html/html5_video.asp
ASKER
Thanks lenamtl, I was hoping to just find out why it wouldn't work anymore and not have to change the code.
This is because Flash is dead, this is disabled by default by almost all browser and not working on mobile device, you should not use Flash anymore ...
Change this to HTML5 code take a few seconds to do...
You can use filmora to create several version / extension video format.
or use free online tool like this one https://www.files-conversion.com/video/ogg
or use https://handbrake.fr/
Change this to HTML5 code take a few seconds to do...
You can use filmora to create several version / extension video format.
or use free online tool like this one https://www.files-conversion.com/video/ogg
or use https://handbrake.fr/
This question needs an answer!
Become an EE member today
7 DAY FREE TRIALMembers can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.