Swap Image

G

Guest

I need to create a button that when clicked will swap the image on my web
page and load another image in its place. The objective is to have a "mini"
navigation list on the page. Can someone give suggestions
 
G

Guest

Most javascript and DHTML scripts swap images on mouseover. See if you can
Google for "image swap on click" or look at all the scripts available when
you Google "image swap" to see if one fits your needs.
 
T

Trevor L.

This code loads an image and places a button beside it which when clicked
swaps the image to another. Clicking it again, swaps the image back again

<html>
<head>
<script type="text/javascript">
var swapped = false ,
pic1 = "images/display/04-04-18-trevor.jpg" ,
pic2 = "images/display/04-04-18-carole.jpg"
function change()
{if (!swapped)
{document.getElementById('picture').src= pic2
swapped = true}
else
{document.getElementById('picture').src= pic1
swapped = false}
}
</script>
</head>
<body>
<img src="images/display/04-04-18-trevor.jpg" id= "picture" alt="">
<input type="button" value="Swap"
onclick="change()">
</body>
</html>
--
Cheers,
Trevor L.
Website: http://tandcl.homemail.com.au

MD said:
J-Bots image components


I choose Polesoft Lockspam to fight spam, and you?
http://www.polesoft.com/refer.html
 
T

Trevor L.

This version uses slightly less code
<html>
<head>
<script type="text/javascript">
var swapped ,
pic1 = "images/display/04-04-18-trevor.jpg" ,
pic2 = "images/display/04-04-18-carole.jpg"
function change()
{document.getElementById('picture').src= (!swapped)?pic2:pic1
swapped = !swapped }
</script>
</head>
<body onload="swapped=true;change()">
<img src="" id= "picture" alt="">
<input type="button" value="Swap"
onclick="change()">
</body>
</html>
 
A

Andrew Murray

what version of frontpage?
2002 has "rollover button" capability
2003 has behaviours - rollver buttons and interactive buttons.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads


Top