 |
|
|
Search this site!
|
 |
 |
|
Resize Browser Window to Fit | Redirect Web Page | Dynamically change text size on a page | Quote of the Day | Eliminate gap from top of page | Disable Right Click | Scroll message on Status Bar | Document transitions | Scroll text in window frame | Spotlight Effect
|
Dynamically change text size on a page
|
Description:
|
Here's how to allow users to dynamically change the font size of specific text on a web page, without the use of style sheets. This tip was provided by a user in the TCH user forum.
|
How to use:
|
1. Simply copy and paste the provided Javascript (at the end of this page) onto your page, using the Insert > HTML Code.
2. The text that you wish to dynamically change should be entered between the <div> and </dev> tags at the end of the script.
3. Publish and try it out.
|
Example:
|
-or-
|
Download the code
right click on link, then click on 'Save target (or frame) as'
|
|
Other information:
|
|
Source code:
<script LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
<!-- Hide script from old browsers
function ChangeFontSize(id, size) {
document.getElementById(id).style.fontSize = size + "px";
}
// End hiding script from old browsers -->
</SCRIPT>
<FONT FACE="Arial" SIZE=3>
<a href="#" onclick="ChangeFontSize('lyr','10')">Small</a></font>
 &;
<FONT FACE="Arial" SIZE=4>
<a href="#" onclick="ChangeFontSize('lyr','20')">Medium</a></font>
<FONT FACE="Arial" SIZE=5>
<a href="#" onclick="ChangeFontSize('lyr','30')">Large</a></font>
<div id="lyr">
Text to change goes here
</div>
|