spacer
Yehuda Shiran October 5, 2001
Dimensionless Zoom Factors
Tips: October 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

Developer News
HP to Microsoft: Thanks for Nothing
iPhone Remains Left Out as Android Scores Flash
The Year of Living the OpenSocial
In Internet Explorer 6 and above, the style object's zoom property can be either a number or a string. The numeric option represents a magnifying factor. A zoom factor of 1 means a normal size. A zoom factor of 2, for example, means an element sized by 2x. A zoom factor of 0.5 will make an element half its original size. Play around with the following text box and see its effect on the text element below it ("Have you read our columns about Print Templates?"):

X

Have you read our columns about Print Templates?

When the zoom property is a string, it should end up with the percent ("%") character. In this case, the semantics are clear. The number represents the zoom factor in percents. A normal size is achieved by a 100% zoom factor. Specify 200% and you'll get the element twice as large. Change it to 50% and you'll end up with an element half its original size. Play around with the following text box and observe the effect of the zoom factor on the element below:

%

Have you read our columns about Print Templates?

Here is the code for the first zoom factor specification above (no "%"):

<INPUT ID="zoomfactor1" TYPE="text" VALUE="50" SIZE="3" 
       MAXLENGTH="4" onkeyup="updateZoom1()">%
<DIV ID="container1">
Have you read our columns about Print Templates?
</DIV></P>
<SCRIPT LANGUAGE="JavaScript">
<!--
function updateZoom1() {
  if (event.keyCode != 13) return;
  container1.style.zoom = zoomfactor1.value;
}
// -->
</SCRIPT>
Notice we do not append the percent sign when assigning the zoom property.


People who read this tip also read these tips:

Look for similar tips by subject:

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

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

webref The latest from WebReference.com Browse >
Administering RBAC in PHP 5 CMS Framework · xref: Automatic Cross Referencing Script · Book Review: Content Rich
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Gateway Launches New Core i7-powered FX-Series Gaming PCs · Review: Lenovo ThinkPad SL300 · EBay, Alternative Site Holiday Resources for Sellers