Java Script With Links and Images
In this article you learn the basics of JavaScript and
create your first JavaScript program.
JavaScript Images
The JavaScript image gallery making of Pictures should be quick process. The gap between snapping some pictures and
published on the web ought to be a short one. Here’s a quick and easy way of making a one-page gallery that uses JavaScript to
the load images and their captions on the fly.
The identify areas of the HTML document that need to be edited to create JavaScript image swapping.
The JavaScript Describe the difference between the mouse enter events and mouse exit events.
JavaScript write the code that will hide the scripts if viewer's browser does not support this
feature.
Example:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
<!--
if (document.images)
{
var pum1 = new Image();
pum1.src = "pussycatdolls_beep.jpg";
var pum2 = new Image();
pum2.src = "AlexanderHaneng_big.jpg";
}
function show_rock()
{
if (document.images)
{
document["pum"].src = pum2.src;
}
}
function hide_rock()
{
if (document.images)
{
document["pum"].src = pum1.src;
}
}
//-->
</SCRIPT>
</head>
<body>
<a href="ram.html"
onClick="alert('Move the mouse over the rock to see a magnified view.');
return false"
onMouseOver="show_rock(); window.status='description of explosiveness scale';
return true"
onMouseOut="hide_rock()">
<IMG SRC="pussycatdolls_beep.jpg" align=right ALT="picture of pumice"
WIDTH="220" HEIGHT="170" hspace=12 vspace=12 name="pum" border=0></a>
</body>
</html> |
When the mouse cursor over a link (the default
image, in this case black) then changes to display a second image in this place.
JavaScript Links
JavaScript is the one of the more comman on the web today .JavaScript is the
image roll over and con be done with the link as very easy and con be done easy
images.
Example:
<html>
<body bgcolor="#FFFFFF">
<title>online.net</title>
<script language="JavaScript">
function image_over(image_name)
{
image_name.src = "images/green.gif"
}
function image_out(image_name)
{
image_name.src = "images/red.gif"
}
</script>
<img name="image1" src="images/red.gif" border=0>
<a href="http://www.roseindia.net/"
onmouseover="image_over(image1)" onmouseout="image_out(image1)">online.net</A>
</body>
</html> |
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
