Blog Has Moved

Tuesday, July 28, 2009

Since migrating my site to Drupal I now no longer use Blogger and hence my blog has moved here.

detecting zoom level in IE7

Wednesday, December 24, 2008

When I recently learned that the submenus in MenuMatic were not being positioned correctly in IE7  (when the zoom level was not 100%) I had to figure out how to detect the current zoom amount. I read a forum post a week or so ago where someone suggested using flash and setting the stage to not scale. I have since looked for that post to give the poster credit but I could not find it. However I used the general idea, and decided to share the flash file in case anybody else needed it (since I mostly found people asking how to detect the zoom level but no working examples).

How It Works:
Basically the movie is 100px wide, the stage's scaleMode is set to not scale, and there is an onenterframe function to detect the stage width and send it to the javascript function. Although when it detects the stage's width it is actually detecting the movie's width while the stage stays at 100px wide. So if the zoom level is 120%  it reads the "stage" width as 120.

The javascript function updates a global variable so you can access it easily. I am not normally a fan of global variables in javascript but felt it was an acceptable solution in this case. The flash file only runs at 1 frame per second, and is less than 2kb in size so it should not be too taxing on user resources. 

1. Insert the .swf into the page.
2. Hide it with css.
3. Add 2 lines to your javascript (the function and the global variable)

Labels: flash, ie7, MenuMatic, zoom

| | posted by Jason J. Jaeger  |