<script type="text/javascript" language="javascript">
function changeColor(str)
{
document.getElementsByTagName("BODY")[0].style.background = str;
}function changeFont(str)
{
document.getElementsByTagName("body")[0].style.fontFamily = str;
}function changeSize(str)
{
document.getElementsByTagName("p")[10].style.fontSize = str;
document.getElementsByTagName("p")[2].style.fontSize = str;
document.getElementsByTagName("p")[3].style.fontSize = str;
document.getElementsByTagName("p")[5].style.fontSize = str;
document.getElementsByTagName("p")[6].style.fontSize = str;
document.getElementsByTagName("p")[7].style.fontSize = str;
document.getElementsByTagName("p")[8].style.fontSize = str;
document.getElementsByTagName("p")[9].style.fontSize = str;
}
function hide(){
var jet = document.getElementById('jetscram').style;
jet.visibility="hidden";}
</script>
<style type="text/css">
div#jetscram{ background:url(http://jetscram.com/images/logo.gif) top left no-repeat; background-color:#ffffff; border:6px #333 solid; font-family:Helvetica, Arial, sans-serif; color:#333; height:28px; padding-left:65px; padding-top:12px; position:fixed; bottom:0; width:594px; left:50%; margin-left:-342px; z-index:5;}
#jetscram select{ width:120px;}
* HTML div#jetscram{ margin-left:0px;}</style>
<div id="jetscram">
Font <select name="fontchange" onchange="changeFont(this.value)">
<option value=""Gill Sans MT", Gill Sans, Gill,Arial, Sans" selected="selected">Gill Sans MT</option>
<option value="Arial, Sans">Arial</option>
<option value="Verdana, Sans">Verdana</option>
<option value="Helvetica,"Helvetica LT", Sans">Helvetica</option>
<option value="Georgia, Sans">Georgia</option>
</select>
Font Size
<select name="fontsize" onchange="changeSize(this.value)">
<option value="12px">12</option>
<option value="13px">13</option>
<option value="14px">14</option>
<option value="15px">15</option>
<option value="16px" selected="selected">16</option>
<option value="18px">18</option>
</select>
Background Color
<select name="backgroundcolor" onchange="changeColor(this.value)">
<option value="#008ed7">0%</option>
<option value="#005fb2">33%</option>
<option value="#012f8b" selected="selected">66%</option>
<option value="#010066">100%</option>
</select>
<a href="#" onclick="hide()" >hide</a>
</div>
May 2nd, 2008 | Web Development
Font size and Font Family Javascript Changing Tool
107
2 comments ↓
If you found this post useful click the share this button. Contribute below by adding a comment, no registration is required.
DCE Related Posts
This post teaches you how to replace CSS text links with an image and an image hover state. Read Full Article...
Read Full Article...
Read Full Article...
I don’t get it.
lol i guess i never explained it : )
Leave a Comment