I have the following code:

<div id="leftDiv" style="float:left; height: 300px; width: 420px;background-color:transparent; position: relative">
  <div style="position:absolute; left:141px; top:180px; width: 319px; z-index:1"><b><%=tmpJsonValue2 %></b></div>
  <div style="position:absolute; left:320px; top:180px; width: 319px; z-index:1"><b><%=tmpJsonValue9 %></b></div>
  <img id="leftImg" style="width:100%; height:100%; z-index:-1; right: 1124px; top: 9px;" src= "xxx.jpg" />
</div>

Which displays an image and on top of it places the info from the variables tmpJsonValue2 and tmpJsonValue9.

I would like to be able to click on the image and print it with the dynamic values of the variables on top of the image, exactly the way it appears on the browser. Any suggestions?

Member Avatar
LastMitch

I would like to be able to click on the image and print it with the dynamic values of the variables on top of the image, exactly the way it appears on the browser. Any suggestions?

Since you post this question on Javacript section. I don't see any javascript related at all.

The only thing I notice is the Response.Write tag which is this:

<%=tmpJsonValue2 %>

I hope you don't expect someone to write this out.

Since you only provide HTML & CSS code. I found a few CSS print related code snippets.

The following links have CSS code snippets which you can used:

http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml

http://www.codeproject.com/Articles/13246/Print-a-doument-with-CSS

http://www.codinghorror.com/blog/2007/01/stylesheets-for-print-and-handheld.html

just need use AJAX. Do a quick search if you're not familiar with it. you would get the dynamic variables with an ajax call and then update the image in your javascript onclick event.