Oft möchte man gern einen bestimmten DIV Bereich drucken. Mit diesem Script lässt sich via Link-Anzeige der Druck des Div Bereiches realisieren. Sollte JavaScript ausgeschalten sein, sieht der Besucher den Link nicht.
Autor: Roger Johansson
zur Demo
in den <head> Bereich einfügen
<!-- Created by: Roger Johansson | 456bereastreet.com -->
<script type="text/javascript">
<!--gefunden auf http://www.scriptwelt.org -->
var addPrintLink = {
init:function(sTargetEl,sLinkText) {
if (!document.getElementById || !document.createTextNode) {return;} // Check for DOM support
if (!document.getElementById(sTargetEl)) {return;} // Check that the target element actually exists
if (!window.print) {return;} // Check that the browser supports window.print
var oTarget = document.getElementById(sTargetEl);
var oLink = document.createElement('a');
oLink.id = 'print-link'; // Give the link an id to allow styling
oLink.href = '#'; // Make the link focusable for keyboard users
oLink.appendChild(document.createTextNode(sLinkText));
oLink.onclick = function() {window.print(); return false;} // Return false prevents the browser from following the link and jumping to the top of the page after printing
oTarget.appendChild(oLink);
},
};
// Multiple onload function created by: Simon Willison
// simonwillison.net
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
addLoadEvent(function() {
addPrintLink.init('article','Print this page');
// In the function above, replace 'article' with the name of the DIV you want printed.
});
</script>
in den <body> Bereich einfügen
<div id="article">
<p>
Das ist ein demo-Text. JavaScripts gibt es auf www.scriptwelt.org!</p>
</div>
|