Zoom over any text

by NicosKaralis

HTML

<!-- Increase an decrease text size with jQuery -->

<a href="" id="minustext" data-target="text">a-</a>
<a href="" id="plustext" data-target="text">A+</a>
<br/>
<div id="text">
    <p>Text to</p>
    <span>more text</span>
</div>
<br/>
<div>
    <p>Text to</p>
    <span>more text</span>
</div>

CSS

div { /* Just for test purposes */
    background: #f00;
    width: 100px;
    overflow: hidden;
}

JavaScript

/* Zoom text */
function zoom(tax, id) {
    var c = document.getElementById(id);
    if (c.style.fontSize == "") {
        c.style.fontSize = "1.0em";
    }
    c.style.fontSize = parseFloat(c.style.fontSize) + (tax * 0.2) + "em";
}

$("a#minustext").click(function() {
    zoom(-1, $(this).attr('data-target'));
    return false;
});
$("a#plustext").click(function() {
    zoom(1, $(this).attr('data-target'));
    return false;
});