dev4wp
-
Posts
2 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Posts posted by dev4wp
-
-
I'm trying to refactor this javascript from this :
var modal = document.getElementById("myModal"); // Get the image and insert it inside the modal - use its "alt" text as a caption var img = document.getElementsByClassName("myImg"); var modalImg = document.getElementById("img01"); var captionText = document.getElementById("caption"); img.onclick = function(){ modal.style.display = "block"; modalImg.src = this.src; captionText.innerHTML = this.alt; } // Get the <span> element that closes the modal var span = document.getElementsByClassName("close")[0]; // When the user clicks on <span> (x), close the modal span.onclick = function() { modal.style.display = "none"; }
And this is my attempt but i am stuck :
( function( $ ) { var modal = $('#myModal'); var img = $('.myImg'); var modalImg = $('#img01'); var captionText = $("#caption"); $("img").click(function(){ modal.style.display = "block"; modalImg.src = $this.src; captionText.innerHTML = $this.alt; }); var span = $("close")[0]; $("span").click(function(){ modal.style.display = "none"; }); } ( jQuery ) );
Refactor Javascript to Use jQuery
in JavaScript
Posted · Edited by dev4wp
Excellent. Works great. The reason i wanted to use jQuery is because i couldn't get it to load when using it in a file in WordPress.