CODEWITHSUNDEEP
jquery
Prem Anandh
Prem Anandh

Reputation: 33

Image Click Event

In my program I used image pop up window. some what images scrolling in home page.

While I click on the image in the sense the pop up will open and show the particular image in popup windows. How I can show the image in pop up window. Now I got the pop up window but I can't show the image in the popup window.

Here is my code so far:

$("img").click(function(){
     var $dialog = $('<div></div>') 
         .html(' <img src="localhost:81/keprandemo/media/catalog/product/cache/1/…; width="200" height="200" alt="Milk(1 lit)">') 
         .dialog({ autoOpen: true, resizable: false, draggable: false, width: 600, height:600, modal: true, title: 'Create Your Own PopUp Window' }); });

Upvotes: 0

Views: 23704

Answers (2)

Amol Navsupe
Amol Navsupe

Reputation: 173

 $("img").click(function(){
 var $dialog = $('<div id="urID"></div>') 
     .dialog({ autoOpen: true, resizable: false, draggable: false, width: 600, height:600, modal: true, title: 'Create Your Own PopUp Window' });
   //ur div id name.
   $('#urID').html('<img src="localhost:81/keprandemo/media/catalog/product/cache/1/…; width="200" height="200" alt="Milk(1 lit)">');
  });

Upvotes: 0

writeToBhuwan
writeToBhuwan

Reputation: 3281

var ImageSource="";
$('.yourImageClass').click(function(){
     ImageSource=$(this).attr('src');
});

//Pass this ImageSource to your image window

EDIT:

$("img").click(function(){
    var source=$(this).attr('src');
    var $dialog = $('<div></div>') 
         .html('<img src="'+source+'" width="200" height="200" alt="Milk(1 lit)">') 
         .dialog({ autoOpen: true, resizable: false, draggable: false, width: 600, height:600, modal: true, title: 'Create Your Own PopUp Window' }); 
});

This code should do the trick.!

Upvotes: 1

Related Questions