views:

325

answers:

2

Hi folks I am trying to create a "simple" modal type of operation. When a user clicks on an image it opens a mask over the screen (done that) and displays the image (can't do that). This is ment to be very simple, no need for galleries etc. hence just a simple effect.

The code generated for the mask is

$j(document).ready(function(){
$j('.postentry img').click(function(e) {  
e.preventDefault();  
var maskHeight = $j(document).height();  
var maskWidth = $j(window).width();  
$j('#mask').css({'width':maskWidth,'height':maskHeight});  
$j('#mask').fadeIn(1000);      
$j('#mask').fadeTo("slow",0.8);    
});  

});

I can get the src of the image (but just forgotten the code) but it's abit like this

Sj('postentry img').att(src)

(Or something I did get it to dispaly properly in an alert but how do I pass that sc to a hidden div and display it above the mask (OK I assume that's z-index in the css) but it's more how do I display the image.

Help please Thanks

A: 

Its

$j('postentry img').attr(src)

See .attr()

and to show the image you can call the .show() method

$j('postentry img').attr('src', yourimageurl).show();

See .show()

rahul
Nearly but not quiet, I can't get the image to open in a new div on click - infact onclick nothing happens (if I remove the mask)
RussellP
A: 

You need to do

$('.postentry img').attr('src', 'imageurl').show();

or just

$('.postentry img').attr('src', 'imageurl');

and then show the div containing the image using

$('#imagediv').show();

If you show your html I could give a definite answer. Also, the you don't need to put the j after $.

ryanulit
Ryan - actually the $j is to avoid no-conflict in WordPress - standard WP practice
RussellP
Ah, I don't use wordpress that much :). Glad I could help.
ryanulit