Printing a div

[chanman]

This is Probably a dumb question but is there some easy way to make a div a link or something to when you click the link it prints.

[chrisburton]

To clarify: You mean so when you click a link/button your printing options pop up?

[chanman]

What I am actually wanting is a div with only text in it, to pull up the printing options when you click on it anywhere. But I only want it to print what is inside the div and nothing else on the page. Sorta like printing text on a page but only certain text. It’s kinda confusing let me know if you don’t understand.

[chanman]

I didn’t want to have to make a print stylesheet but there may be no other way for what i’m wanting.

[chrisburton]

Yeah, I’ve never heard anything being done like this.

[chanman]

I didn’t think I was going to be able to do it. I wish there was some kind of plugin for it.

[Mottie]

I’ve done something like this before… the problem is the browser, by default, will print the entire page. So the trick is to open up a new window with the content you want printed, then have the browser print the contents of that window.

I put together an example for you… it has a few variables you can modify such as “autoPrint” which when true will automatically start printing, well the print option window should pop up. Otherwise you need to click the print button inside the popup window. Then manually close the popup – I don’t think there is any way around that.

I hope that helps!

[chanman]

That is exactly what I’m looking for thanks everyone.

[vebbymastidude]

How Can i load CSS If i use CTRL+P in Google Chrome.

I can maintain the print command from button click events like that. But when i use CTRL + P in google Chrome …it does not inherit the CSS.

[Mottie]

Hi vebbymastidude!

You should just include the print styling in your main css. Use a link with media=”print” or use an inline `@media print`. Check out [this guide](http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml).

[Author]

Posts