Alternate document for printing - JavaScript Made Easy: Free JavaScripts Tutorials Example Code

Metachecker.net

|

TrafficChecker.net

|

RankChecker.net

Learn Java Script Today

|

Over 5000 Free Fonts

|

|

Javascript Forum

|

Other Javascript Resources

|

JavaScript Basics

Inserting Javascript

Complete Tutorial

Advance DHTML Tutorial


Alternate document for printing

Printing a page online usually means printing more than what you actually want. Webpages are quite fancy nowadays, with ad banners on top, navigational links on the left, and so on. That's fine when you're viewing the page online, but when you're printing the page, you only want to print out the "actual content", and nothing else from the page! Many sites nowadays understand this, and provide an alternate "print" version of the document that surfers can go to and print out. Well, there's actually a much more elegant and seamless way of accomplishing the same thing, and that is by using the tag. IE 4+ (and hopefully NS 5 when it comes out) supports a version of the tag that allows you to specify to the printer which file it should print when the user selects print. In other words, the job of locating the alternate print version of the document to print out is left to the printer, instead of the surfer. Simply copy the below into the <HEAD> section of your web page. Change printversion.doc to the file intended to be used for printing. The file can be of virtually any format (pdf, Word etc). When the user selects "Print", the printer will look for this file and print it instead of the current page. Netscape will simply ignore this tag, and print out the original page.


Insert into <HEAD>
<link rel=alternate media=print href="printversion.doc">

Insert into <BODY>


Other Options
Description: Printing a page online usually means printing more than what you actually want. Webpages are quite fancy nowadays, with ad banners on top, navigational links on the left, and so on. That's fine when you're viewing the page online, but when you're printing the page, you only want to print out the "actual content", and nothing else from the page! Many sites nowadays understand this, and provide an alternate "print" version of the document that surfers can go to and print out. Well, there's actually a much more elegant and seamless way of accomplishing the same thing, and that is by using the <link> tag. IE 4+ (and hopefully NS 5 when it comes out) supports a version of the <link> tag that allows you to specify to thr printer which file it should print when the user selects print. In other words, the job of locating the alternate print version of the document to print out is left to the printer, instead of the surfer. Take a look at the below example, and it will all be clear. Demo: Let's say you're interested in only printing out the content in gray below from this page. As the webmaster, I could have helped you out by creating another HTML document with only the below content, and telling you to go there and print that document instead. However, I'm not going to do that. Instead, I've prepared a Word document called printversion.doc, and by adding the following: <link rel=alternate media=print href="printversion.doc"> to the <head> section of this page, informed the printer to directly proceed to printversion.doc and print it when you select "print" on this page. In other words, the printer will print out printversion.doc instead when you choose "print" on printstyle.htm. To see this in action, try printing this page now (you'll need IE 4 or above)! The following article discusses what DHTML is, and also the differences in implementation of DHTML between Netscape Communicator and MS Internet Explorer 4. What is DHTML? DHTML(Dynamic HTML) is a technology supported by Netscape Communicator and IE 4 that enables a web document to be dynamic. DHTML is NOT JavaScript, but rather, a generic enhancement to the browser itself that allows elements to be moved around, content to appear and disappear, text to change even after the document has loaded etc. JavaScript (or any other scripting language, for that matter), merely provides the means to access these enhancements. DHTML is not a programming language, but a feature. What's the difference between DHTML in Communicator, and in Internet Explorer 4.0? Everything. Communicator and Internet Explorer 4 are currently at very different stages in terms of support for DHTML as recommended by WC3. In short, Communicator is considered vastly behind in its support for true DHTML, while IE 4 is more on track. Its important to realize that both browsers do not yet completely support the DHTML technology as outlined by the WC3. Below lists how Dynamic HTML is implemented in the two browsers: In Communicator: Dynamic HTML is mainly realized through the <layer> tag. The <layer> tag can be moved around, hidden or displayed, its content dynamically changed, etc. Netscape 4 relies exclusively on this one tag when it comes to DHTML. In Internet Explorer 4: Dynamic HTML is realized through the browser itself (as opposed to any one tag), with the entire browser able to be dynamic. All elements in a document can be dynamically accessed and altered on demand, even after the document has loaded. What's the difference between JavaScript1.2 and DHTML? JavaScript 1.2, the latest version of JavaScript (as of NS 4/IE 4) is merely a subset of DHTML that is used to access the DHTML's features. For example, the code document.layers is a JavaScript 1.2 coding that accesses the layer object of NS 4. In IE 4, web developers can use scripting languages other than JavaScript 1.2 to access its DHTML features, such as VBScript, JScript etc. NS 4 does not allow that kind of liberty. What is the relationship between CSS (Cascading Style Sheets) and DHTML? CSS is a styling technology that allows web developers the liberty to apply style and formatting to a document through a centralized location. In Netscape 4, that is all that CSS does, but IE 4 also utilizes CSS (namely, the id attribute of CSS) to allow web developers easy access to various elements in a document.