Saturday, October 17, 2009

0

Change Image with useing of Java Script...

<html>
<style>
body {background-Color:darkred;margin-top:0;margin-left:0;margin-right:0;margin-bottom-0;}
a {color:pink;font-size:16;text-decoration:none;font-weight:bold;}
a:hover {color:yellow;font-size:18;text-decoration:none;font-weight:bold;}
</style>
<script language="JavaScript">
function cimage(imagename)
{
img1.src=imagename;
}
</script>
<body>
<table width="100%" align="center">
<tr>
<td align="center" height="50">
<a href="#" onClick="cimage('pics/1.jpg')">1 | </a>
<a href="#" onClick="cimage('pics/2.jpg')">2 | </a>
<a href="#" onClick="cimage('pics/3.jpg')">3 | </a>
<a href="#" onClick="cimage('pics/4.jpg')">4 | </a>
<a href="#" onClick="cimage('pics/5.jpg')">5 | </a>
</td>
</tr>
<tr>
<td align="center">
<img src="pics/1.jpg" id="img1" name="img1" height="520" alt="Salam">
</td>
</tr>
</table>
</body>
</html>
Made By: Muhammad Waqas Shaikh

Wednesday, October 7, 2009

0

Make Easy Gradient Color.

</html>
<style>
body {
background-color:#FFFFFF;
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='darkred',EndColorStr='pink');
margin: 0px ;
}
h1 {color:white;font-weight:bold;}
a {color:white;font-weight:bold;text-decoration:none;font-size:36}
a:hover {color:yellow;font-weight:bold;text-decoration:underline;font-size:42;}
</style>
<body>
<center><a href="http:\\www.htmlcodings.blogspot.com">Made by Muhammad Waqas Shaikh</a></center>
</body>
</html>

Made by: Muhammad Waqas Shaikh.
0

Make Easy Drop Down Menu.

<html>
<style>
body{margin-top:0;margin-left:0;margin-right:0;margin-bottom:0;background:lightblue;
BACKGROUND-COLOR:DARKRED;
SCROLLBAR-FACE-COLOR:DARKORANGE;
SCROLLBAR-track-COLOR:lightORANGE;
SCROLLBAR-SHADOW-COLOR:DARKRED;
SCROLLBAR-ARROW-COLOR:DARKRED;
SCROLLBAR-3D-COLOR:DARKRED;}
a{color:darkred;text-decoration:none;}
a:hover{color:yellow;font-size:20;}
table{font-size:20;color:white;}
td.menu{background:darkORANGE;color:darkred;font-size:18;}
table.menu
{
position:absolute;
visibility:hidden;
background:DARKRED;
}
</style>
<script language="javascript">
function show(elmnt)
{
document.getElementById(elmnt).style.visibility="visible";

}
function hide(elmnt)
{
document.getElementById(elmnt).style.visibility="hidden";
}
function scolor(elmnt)
{
document.getElementById(elmnt).style.background="green";
}
function ccolor(elmnt)
{
document.getElementById(elmnt).style.background="darkgreen";
}
</script>
<body>
<table width="1000" BORDER="2" BORDERCOLOR="DARKORANGE">
<tr bgcolor="darkRED">
<td onmouseover="show('a')" onmouseout="hide('a')" width="196">
Home<br />
<table class="menu" id="a" width="200">
<tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.google.com.pk">Waqas</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.yahoo.com">Shaikh<a/></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.msn.com">Omair</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.sms.com">Ahsun</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.download.com">Kamal</a></td></tr>
</table>
</td>
<td onmouseover="show('b')" onmouseout="hide('b')" width="194">
Quran<br />
<table class="menu" id="b" width="200">
<tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.alquranic.com">Arabic Quran</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.alquranic.com">Translation in Urdu</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.alquranic.com">Translation in Eng</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.alquranic.com">Audio Quran</a></td></tr>
<td bgcolor="darkorange" onmouseover="this.bgColor='orange'" onmouseout="this.bgColor='darkorange'"><a href="www.alquranic.com">Video Quran</a></td></tr>
</table>
</td>
</tr>
</td>
</tr>
</table>
</body>
</html>