Share This!

Tuesday, February 14, 2012

Easy Javascript Magnifying Glass

I had to do a report listing emails sent from my system... the report was going to be huge with all the text from the emails included, so I wrote a quick mouseover magnifier that bumped up the size of the text.

Behold.
<div onmouseover="this.style.fontSize='1em'" onmouseout="this.style.fontSize='.5em'">


The fun parts of this that matter are...
onmouseover="this.style.fontSize='1em'" 
and 
onmouseout="this.style.fontSize='.5em'"

These, when applied to the div, will cause the text in the grid to change size accordingly.

Sample - mouse over this to expand:
I had to do a report listing emails sent from my system... the report was going to be huge with all the text from the emails included, so I wrote a quick mouseover magnifier that bumped up the size of the text.

Behold.
<div onmouseover="this.style.fontSize='1em'" onmouseout="this.style.fontSize='.5em'">


The fun parts of this that matter are...
onmouseover="this.style.fontSize='1em'" 
and 
onmouseout="this.style.fontSize='.5em'"

These, when applied to the div, will cause the text in the grid to change size accordingly.


Bryan Valencia is a contributing editor and founder of Visual Studio Journey.  He owns and operates Software Services, a web design and hosting company in Manteca, California.

No comments:

Post a Comment

Contact Us

Name

Email *

Message *