PDA

View Full Version : Lightbox image viewer 2.03 Mod



martino
07-18-2007, 07:53 PM
1) Script Title: Lightbox image viewer 2.03

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm

3) Describe problem:

Hello, I was wondering if its possible to add a Print Image to the left of the Close image.

It would be great if once Print is clicked, the windows Print Dialog box appears.

Your help would be greatly appreciated.
Thanks.
Martin

eld
02-06-2008, 10:12 PM
1) Script Title: Lightbox image viewer 2.03

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...box2/index.htm

3) Describe problem: I am having a problem with the print feature that I have added to my lightbox. The print button works but it prints the whole page as opposed to just the image in the lightbox.

Here is the code that I used:
rel="lightbox" title="Caption <a href='javascript: window.print();' > Print </a>"

How can I have it just print the image instead of the whole page?

Thanks in advance,

Eric

jscheuer1
02-07-2008, 02:42 AM
Add this stylesheet link:


<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/lb_print.css" type="text/css" media="print" />

contents of lb_print.css -


html, body {
display:block;
}
body * {
display:none;
}
#lightbox,
#lightbox #outerImageContainer,
#lightbox #outerImageContainer #imageContainer,
#lightbox #outerImageContainer #imageContainer #lightboxImage {
display:block!important;
opacity:1.0!important;
}

okstated
04-21-2008, 04:08 AM
Hi,

No one seems to have answered the question of the guy who started this thread.
When someone says:


Here is the code that I used:
rel="lightbox" title="Caption <a href='javascript: window.print();' > Print </a>"

What do they mean? What file is this? What line is this? Is that the only code?
Thanks:)

Nile
04-21-2008, 04:16 AM
There saying that thats what they used on there image(I think the image). For an extension.

okstated
04-21-2008, 04:26 AM
Thanks Nile

What file is this? What line is this? Is that the only code?

in lightbox.js what must I alter to create a print link for the image?

I've searched and found discussions on css for printing, but no one makes it clear how they actually inserted the link in the first place.

ANM238
04-30-2008, 01:08 PM
Hi,

No one seems to have answered the question of the guy who started this thread.
When someone says:



What do they mean? What file is this? What line is this? Is that the only code?
Thanks:)
Allow me to amplify what the poster in post #3 above added:


Create the stylesheet lb_print as instructed in Post #3 and link to it in the HTML head
Now, in your link to open the light box image thus:
<a href="images/image-1.jpg" rel="lightbox" title="my caption - click to print" rev='javascript: window.print();'>image #1</a> The code shown in red is what will print your image based upon the css in lb_print.css


This will print only the light box image and not the entire page.
Make sure you are using lightbox 2.03a

Hope that helps!