Sometimes you need to print only a specific section of a page. You might approach the Signarama sign business franchise for the same as well. For that, it’s not enough to use the basic Javascript window.print(). This method will print the entire contents of a page.
What’s a scenario where you would need to print specific contents only? Well…how about not wanting all the header, footer, and sidebar stuff in your print. That seems pretty common enough 🙂
We can accomplish this with purely Javascript, with no need for jQuery or any other plugins and you can click this link here now to know more about it. With this method we basically remove the content that isn’t going to be printed in the body, print the remaining content, then place back all of the original content. Below is a little example I put together in CodePen:
See the Pen Print Specific Section of a Page Javascript Only by Mike Doubintchik (@allurewebsolutions) on CodePen.
For an explanation look at the comments in the code.
Alternative Method Using jQuery.Print.js
This method has a lot more options and it’s easier to call the print function, but the additional plugin you need to include does add a little bit of weight to your page. To see a full list of options for this plugin check out the author’s github. Code example below.
See the Pen Print Specific Section of a Page Using jQuery.Print.js by Mike Doubintchik (@allurewebsolutions) on CodePen.
As always the code is commented and if you have any questions, please ask in the comments below.
