473,699 Members | 2,155 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

image swap + restore + set

Hi all

I'm looking for a solution that can be used in a calendar/gig guide
scenario where each day is represented by a dot image. Now this dot must
do the following

1. When the mouse goes over the dot image it swaps to the mouseover dot
2. When the mouse goes out of the dot image it restores back to the
original img
3. When the img is clicked the dot image is swapped with another image
(different to the other 2) that will remain there even when the mouse
goes out of the image

I've been searching high & low for an answer but with no luck

Any gurus out there able to help ???

Cheers

Matthew
Jul 23 '05 #1
2 1886
"Matthew" <di******@hotma il.com> wrote in message
news:42******** @duster.adelaid e.on.net...
Hi all

I'm looking for a solution that can be used in a calendar/gig guide
scenario where each day is represented by a dot image. Now this dot must
do the following

1. When the mouse goes over the dot image it swaps to the mouseover dot
2. When the mouse goes out of the dot image it restores back to the
original img
3. When the img is clicked the dot image is swapped with another image
(different to the other 2) that will remain there even when the mouse goes
out of the image

I've been searching high & low for an answer but with no luck

Any gurus out there able to help ???


Try googling "javascript rollover" or "javascript image rollover"

Jul 23 '05 #2
Matthew wrote:
Hi all

I'm looking for a solution that can be used in a calendar/gig guide
scenario where each day is represented by a dot image. Now this dot must do the following

1. When the mouse goes over the dot image it swaps to the mouseover dot 2. When the mouse goes out of the dot image it restores back to the
original img
3. When the img is clicked the dot image is swapped with another image (different to the other 2) that will remain there even when the mouse goes out of the image

I've been searching high & low for an answer but with no luck

Any gurus out there able to help ???

Cheers

Matthew


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<base href="http://snaught.com/JimsCoolIcons/Marbles-W/">
<style type="text/css">

table {
width: 400px;
margin: 100px auto;
border-collapse: collapse;
border: 3px #fff inset;
}
td {
font: bold 11px tahoma;
border: 1px #000 solid;
background: #fafffa;
}

</style>
<script type="text/javascript">

//::::::::::::::: ::::::::::::::: :
var overurl = 'green-glass.jpg';
var outurl = 'green.jpg';
var clickurl = 'red-glass.jpg';
//::::::::::::::: ::::::::::::::: :

function init()
{

function over()
{
if (!/red/.test(this.src) )
this.src = this.src.replac e(outurl, overurl);
}
function out()
{
if (!/red/.test(this.src) )
this.src = this.src.replac e(overurl, outurl);
}
function click()
{
this.src = clickurl;
}

var i = 0,
img,
imgs = document.getEle mentsByTagName( 'img');
while (img = imgs.item(i++))
if (img.className == 'swap')
{
img.onmouseover = over;
img.onmouseout = out;
img.onclick = click;
}
var plover = new Image().src = 'green-glass.jpg';
var plclick = new Image().src = 'red-glass.jpg';
}

window.onload = function()
{
if (document.getEl ementsByTagName )
init();
}

</script>
</head>
<body>
<table cellspacing="1" >
<tbody>
<script type="text/javascript">
document.write( '<tr>');
var d = 0;
while (d < 31)
{
if (d && d % 7 == 0)
document.write( '</tr><tr>');
document.write( '<td><img class="swap" src="green.jpg" >',++d,'</td>');
}
document.write( '<td></td><td></td><td></td>');
</script>
</tbody>
</table>
</body>
</html>

Jul 23 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
2074
by: John | last post by:
I am rotating images of different dimensions. My problem is that when a new image is displayed in a new position which had an image of a different dimension, the old image is first stretched to the dimension of the new image, before the new image is loaded. How can I stop this stretching behavior? See the banner images on the right at http://finialworld.com thank you John
2
1988
by: Cynthia | last post by:
I'm looking for javascript code that when I mouse over a menu item will display a picture elsewhere on the page. I know it exists, but the ones I've found so far just swap out the menu item in place. Even better would be one where I can swap the menu image and display an image elsewhere on the page. Many thanks!
2
1554
by: Frank Bishop | last post by:
I have been trying to do image swaps and my second image does not show up, it just goes to a blank image on the mouseover. I have Windows XP SP2 and it prompts me to allow blocked content when the page loads and then I do allow. But the swap still does not show up, just the first image. Also, is there a more advanced example that has multiple swap buttons in a menu (maybe in an array)? Help appreciated. <code> <head> <title>Cool...
2
4486
by: broms10 | last post by:
I need help. I have a little button that says "next" below a big image, let´s call it "image1", when I press the button I want to swap the big image to "image2". And then if I press it again I want it to swap to "image3" and the next time to "image4" and so on. I´m not so good at javascripts but I found a script that can make the button swap "image1" to "image2" when I click it, but the problem comes when I want the same button to swap...
12
2583
by: Charlie King | last post by:
As I understand it, the use of FIR* to replace heading tags with images in visually enabled CSS browsers is now frowned upon on the basis that some screen readers will *nor* read back text that is marked up by CSS to be invisible or hidden. So... If I want to replace headings with images (because my client wants to use his specific font for headings where possible), what's the best way to do it?
4
4224
by: bridgemanusa | last post by:
Hi All: I have a very long page of html that I want to take portions and hide them in divs, then show when a link is clicked. I have the hide show part working when the link is clicked, however I would really like to use linked images instead to do the following: - When open.gif is clicked, the contents of the div show and open.gif is swapped with close.gif - subsequently, when close.gif is clicked, the div contents get hidden
3
4374
by: dcruncher4 | last post by:
It is possible that we may be asked to restore a production tape, say 3 yrs later. We would prefer redirect restore for that. I am documenting a process to do a redirect restore. We take production backups via Legato. The big question is that how to get information about tablespace and containers from the tape backup. A search on this told me that db2ckbkp is the command to go for. I tested it on a backup residing on unix file system...
4
11506
by: lemat | last post by:
Hi, I use a radio button form in which users can select a color by clicking on a image. I would like this image to change to another one when it's chosen. (image with a "Chosen" Stamp in the middle) Of course I like it to be restored if hte user select another color. I've tried to add behaviour to the image (swap on click) and on the button (onchange swap restore) but it doesn't work (hte image id swapped and restored almost instantly).
2
8792
by: smokeyd | last post by:
i am trying to create a simple image button rollover.. i have searched this forum and found a number of solutions but none seem to work. i am just trying to get the onmouseover to swap the image then restore when rolled out on a web page in vb.net. please can someone help?
0
8697
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9045
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
7767
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
5878
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4382
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4634
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
3062
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
2359
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2013
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.