spacer
Yehuda Shiran October 3, 2001
Zooming In and Out On Line
Tips: October 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?

You can control the zoom factor of an element online. A 100% zoom factor means the element will be displayed in its normal size. A larger zoom factor creates the impression of zooming in. A less-than-100% zoom factor displays the element zoomed out. Play around with the following zoom factor, and see its effect on the element beneath ("Have you read our columns about Print Templates?").

%

Have you read our columns about Print Templates?

The above demo includes a text box for the zoom factor entry, a DIV element for the sentence ("Have you read our columns about Print Templates?"), and an onkeyup event handler in JavaScript. Whenever the user enters a digit in the text box, the zoom factor is being updated after he or she releases that key. Here are the definitions:

<INPUT ID="zoomfactor" TYPE="text" VALUE="50" SIZE="3" MAXLENGTH="4" onkeyup="updateZoom()">%
<DIV ID="container">
Have you read our columns about Print Templates?
</DIV>
<SCRIPT LANGUAGE="JavaScript">
<!--
function updateZoom() {
  container.style.zoom = zoomfactor.value + "%";
}
// -->
</SCRIPT>
This tip works on IE 6.0 and above.


People who read this tip also read these tips:

Look for similar tips by subject:

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business