CODEWITHSUNDEEP
javascripthtmlcss
Pacerier
Pacerier

Reputation: 89633

is there some way we can react to the user zoom event?

When we go to apple's website: sbsstatic/maintenance.html?start=0&tstart=0">https://discussions.apple.com/sbsstatic/maintenance.html?start=0&tstart=0

and we do some zooming (Ctrl + and Ctlr -0), we can see the top bar has a sliding effect while we are zooming.

Does anyone know of any ideas how would/could that be implemented?

Upvotes: 4

Views: 3223

Answers (3)

Timbo
Timbo

Reputation: 4533

This is using some CSS Animation tricks. There's a tutorial here.

A sample of the type of style (from the above tutorial) that will give you the effect your looking for:

<div style="-webkit-transform: scale(2); -moz-transform: scale(2); -o-transform: scale(2);">...</div>

You can take a look at their "enhanced" style sheet that sorts this out here.

Upvotes: 0

user529649
user529649

Reputation:

Yes!

Yes, write a keyboard event handler or us a Library like this: http://www.openjs.com/scripts/events/keyboard_shortcuts/

Upvotes: 0

Jacek Kaniuk
Jacek Kaniuk

Reputation: 5229

There is no onzoom event even in HTML5:

http://www.w3schools.com/html5/html5_ref_eventattributes.asp

"One way to detect zoom level changes relies on the fact that percentage values are not zoomed. A percentage value is relative to the viewport width, and thus unaffected by page zoom. If you insert two elements, one with a position in percentages, and one with the same position in pixels, they’ll move apart when the page is zoomed. Find the ratio between the positions of both elements and you’ve got the zoom level."

http://novemberborn.net/2007/12/javascriptpage-zoom-ff3-128

Upvotes: 4

Related Questions