ines Posted August 17, 2019 Share Posted August 17, 2019 Hello, I have different overlay images on iframe vimeo videos. As I have several embeded vimeo videos and overlay images, I would like to add a script so that when I click on one overlay image it doesn't apply to all the overlay images on the page. Here's the code, thanks <!DOCTYPE html> <html> <head> <style> #vid { display: none; margin-top: -365px; z-index:1; } #vid2 { display: none; margin-top: -365px; z-index:1; } #iframe_id { pointer-events: none; } </style> </head> <body> <img src="https://www.ebnerfilm.com/wp-content/uploads/2019/08/LV_INTERVIEW_GIF_PLAY.gif" class="gliphy" onclick="myFunction()"> <div id="vid"> <iframe src="https://player.vimeo.com/video/353777739" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> </div> <img src="https://www.ebnerfilm.com/wp-content/uploads/2019/08/LOIS_LANE_GIF_PLAY.gif" class="gliphy" onclick="myFunction()"> <div id="vid2"> <iframe src="https://player.vimeo.com/video/196409842" width="640" height="360" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe> </div> <script> function myFunction() { document.getElementById("vid").style.display = "block"; document.getElementById("vid2").style.display = "block"; } $('#iframe_id_wrapper').click(function() { //run function that records clicks }); </script> </body> </html> Link to comment Share on other sites More sharing options...
dsonesuk Posted August 18, 2019 Share Posted August 18, 2019 (edited) IF the container div ALWAYS follow the clicked image you can use 'this' to represent the element just clicked and '.nextElementSibling' to transverse to next element (div with id) onclick="myFunction(this)"; function myFunction(elem) { elem.nextElementSibling.style.display = "block"; } Edited August 18, 2019 by dsonesuk Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now