Dynamically Change background-color

[Total: 0    Average: 0/5]

This example shows you how to change various HTML page properties using javascript.

Head Code:

<script language="javascript">

function bgchange()
{
var color=(document.info.bg.value)
document.bgColor=(color)
}
function linkchange()
{
var color=(document.info.link.value)
document.linkColor=(color)
}
function vlinkchange()
{
var color=(document.info.vlink.value)
document.vlinkColor=(color)
}
function alinkchange()
{
var color=(document.info.alink.value)
document.alinkColor=(color)
}
function titlechange()
{
var info=(document.info.title.value)
document.title=(info)
}
</script>

Body Code:

<center>
<form name="info">
<hr><p><TABLE WIDTH="400" BORDER="1" CELLSPACING="2" CELLPADDING="0">
<tr><td>Title:</td><td><input type="text" name="title" size="30"></td><td><center><input type="button" onClick="titlechange()" value="Change!"></center></td>
<tr><td>BG Color:</td><td><input type="text" name="bg" size="30"></td><td><center><input type="button" onClick="bgchange()" value="Change!"></center></td>
<tr><td>Link Color:</td><td><input type="text" name="link" size="30"></td><td><center><input type="button" onClick="linkchange()" value="Change!"></center></td>
<tr><td>V-Link Color:</td><td><input type="text" name="vlink" size="30"></td><td><center><input type="button" onClick="vlinkchange()" value="Change!"></center></td>
<tr><td>A-Link Color:</td><td><input type="text" name="alink" size="30"></td><td><center><input type="button" onClick="alinkchange()" value="Change!"></center></td>
</table>
</form>
</center>

Times Viewed: 1

Leave a Reply

Your email address will not be published. Required fields are marked *