How to pop up image in data:image in HTML a tag with javascript/jQuery?

Apockalyptik

New Member
I'm trying to pop-up of image stored as "data:image" (URI resource). That is, the image is not located as a file or a URL source on the client machine. The client who visits my site can click on a button to capture screen-shot of a live video and the javascript I wrote save it as the example below:\[code\]<div style="display: block;" class="thumbnailbox" id="imgbox1"> <a class="thumbnail-popup" title="Image 1" href="http://stackoverflow.com/questions/13736143/data:image/png;base64,iVBORw0KGgoAAAA .......np52TGFRCDPuQNWUDQAAAABJRU5ErkJggg==" class="thumbnail"> <img alt="Image 1" src="http://stackoverflow.com/questions/13736143/data:image/png;base64,iVBORw0KGgoAAAA ......QAAAABJRU5ErkJggg==" class="thumbnail"/> </a></div>\[/code\]I use a pop-up helper like http://www.script-tutorials.com/jquery-css-tutorial-zooming-image/. But, whenever I click on the \[code\]<a>\[/code\] tag above, the browser loads the image in the same window. I would like to see the pop-up effect--do not want to open the image in another/same window or tab.I've read How to change href of <a> tag on button click through javascript, but this is only for simple situation.Can anyone tell me if there's a way (or a library/plugin) that will allow me to load image in "data:image" as a pop-up? Thank you.Note: In case anyone is about to suggest me why I cannot have a URL for image, the nature of my project just can't afford the time it takes for the image from the client's browser to be transferred back to my poor man's server.
 
Back
Top