Hi

I'm new at javascript. I have many images on my mobile page and would like to adapt the following jquerymobile code to allow it to be used without hardcoding the image path in the data-role="popup" div. 

Here are the two parts to the code. The first section is used to display a thumbnail that when touched displays a lightbox with a higher res picture:

 

  
<a href="#popupPhoto" data-rel="popup" data-position-to="window" data-inline="true" data-transition="fade" ><img  class="v100col" alt="equinox" src="images/equinox.jpg"></a>       
 

Touching the picture executes the following to display the popup:

 

  
</div>
<div data-role="popup" id="popupPhoto" data-overlay-theme="a" data-theme="a" data-corners="false">
<a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a><img class="popphoto" rc="images/equinox_big.jpg" alt="Equinox">
</div>
 

I would like to replace src="images/equinox_big.jpg" with a variable so that the same div routine can be executed for all the images on my mobile page.

Before the image is displayed the following on-event function executes

 

  
$( ".photopopup" ).on({
popupbeforeposition
: function() {
var maxHeight = $( window ).height() - 60 + "px";
$
( ".photopopup img" ).css( "max-height", maxHeight );
}
}); 
 

I would think that if it's possible the popupbeforeposition would have to have access to the src image value and make the change to the src path. 

I don't know javascript syntax well enough to be sure, but I suspect the following from popupbeforeposition() references the photopup node's image property:

    $( ".photopopup img" ) 

and hopefully I could use a variable in the following way in that function

`$( ".photopopup img src" ) = myNewPath;`

I supposed I would initialise myNewPath in the the thumbnail div. 

Will this be possible?

Thanks