Print is an easy and simple jQuery plugin that allows the visitor to print only the specified area of your web page.
See also:
How to use it:
1. Specify an unique ID to your html element where you want to make it printable.
<div id="printable"> Your Content </div>
2. Create a button to print the specified html element.
<button class="print"> Print this </button>
3. Import the latest jQuery library and jQuery print plugin.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="../jQuery.print.js"></script>
4. Call the plugin on the print button.
<script type='text/javascript'>
$(function() {
$("#printable").find('.print').on('click', function() {
$.print("#printable");
});
});
</script>
5. Settings.
$(function() {
$("#printable").find('.print').on('click', function() {
$("#printable").print({
// Use Global styles
globalStyles : false,
// Add link with attrbute media=print
mediaPrint : false,
//Custom stylesheet
stylesheet : "http://fonts.googleapis.com/css?family=Inconsolata",
//Print in a hidden iframe
iframe : false,
// Don't print this
noPrintSelector : ".avoid-this",
// Add this on top
append : "Free jQuery Plugins<br/>",
// Add this at bottom
prepend : "<br/>jQueryScript.net",
// Manually add form values
manuallyCopyFormValues: true,
// resolves after print and restructure the code for better maintainability
deferred: $.Deferred(),
// timeout
timeout: 250,
// Custom title
title: null,
// Custom document type
doctype: '<!doctype html>'
});
});
Changelog:
2017-08-21
- v1.6.0: Replce clone method with one that retains select and textarea values when cloning
2017-01-04
- Fix printing issue on iPad
2016-09-15
- Support the load event and set the timeout option as its fallback
2016-02-10
- Reorganized code and added the doctype option
2015-08-02
- Allow setting a custom timeout for accommodating different server load times, etc
2015-04-27
- Fixed: Won't get changed form values from textareas
2015-04-08
- Fixed: Mixed up append & prepend
2015-01-16
- Manually add form values , add a deferred object that resolves after print and restructure the code for better maintainability
This awesome jQuery plugin is developed by DoersGuild. For more Advanced Usages, please check the demo page or visit the official website.
- Publication date: 21.08.2018
- Source