Jump to content

Recommended Posts

Ok.I have a button on my site. I have created 3 button images: 1 for an inactive button, one for an active button, and one for a clicked button. It doesn't work, as you can see on the site. The button is located to the menu on the left, it says 'quests' on it.This is my code, why won't it work?

<img src="images/Buttons/quests-unactive.png" onmouseover="this.src='images/Buttons/quests-active.png'" onclick="this.src='images/Buttons/quests-clicked.png'" onmouseup="this.src='images/Buttons/quests-unactive.png' alt=" />

It behaves erratically, again, check the site to see what it does.Thanks to anyone who can fix this.~Chocolate570

Link to post
Share on other sites
onmouseup="this.src='images/Buttons/quests-unactive.png' alt="" />

first, close your onmouseup attribute

onmouseup="this.src='images/Buttons/quests-unactive.png'" alt="" />

then see if you have any issues. I'm also seeing the following two javascript errors too:Unknown property 'align'. Declaration Dropped Line 0andUnknown property 'font-color'. Declaration Dropped Line 57but the latter might be due to the first problem. And, BTW, the Line 0 issues regenerates about every 8 seconds.

Link to post
Share on other sites

Could anyone make the code for me? It jst isn't working, i don't know what's wrong. Here are the three images:images/Buttons/quests-unactive.pngimages/Buttons/quests-active.pngimages/Buttons/quests-clicked.pngThe names explain it all. Thanks so much. This is kinda sad, isn't it....

Link to post
Share on other sites
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>iribbit.net - Leap into the online experience! - ROLLOVER</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script language="javascript" type="text/javascript">/////////////////////////// rollover javascript ///////////////////////////if (document.images)	{	QuestsOn = new Image();	QuestsOn.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-active.png";	QuestsOff = new Image();	QuestsOff.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-unactive.png";	QuestsClick = new Image();	QuestsClick.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-clicked.png";}function SwitchImage(locat,name){	if (document.images){newBar = eval(name + ".src");	document [locat].src = newBar;	}} </script></head><body><a href="##" title="Quests"    onclick="SwitchImage('Quests','QuestsOff')"   onmousedown="SwitchImage('Quests','QuestsClick')"   onmouseover="SwitchImage('Quests','QuestsOn')"   onmouseout="SwitchImage('Quests','QuestsOff')">   <img id="Quests" name="Quests" src="http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-unactive.png" width="97" height="25" border="0" alt="Quests"></a><br><br></body></html>

(minus the preloader)Preview it here:http://www.iribbit.net/_files/chocolate570-rollover.cfm

Link to post
Share on other sites

That's exactly what I want, except for the fact that i'm going to have around like 8 buttons, and doing a function for each of them is going to be annoying. Instead of javascript, can someone do it with the onmouseover="this.src=''" thing? :S

Link to post
Share on other sites
That's exactly what I want, except for the fact that i'm going to have around like 8 buttons, and doing a function for each of them is going to be annoying. Instead of javascript, can someone do it with the onmouseover="this.src=''" thing? :S

You don;t need a new function for each all you have to do is repeat these parts of teh code for each respective image you want to use this with. Of course, make the javascript and external file:Javascript
QuestsOn = new Image();QuestsOn.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-active.png";QuestsOff = new Image();QuestsOff.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-unactive.png";QuestsClick = new Image();QuestsClick.src = "http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-clicked.png";

andHTML

<a href="##" title="Quests"    onclick="SwitchImage('Quests','QuestsOff')"   onmousedown="SwitchImage('Quests','QuestsClick')"   onmouseover="SwitchImage('Quests','QuestsOn')"   onmouseout="SwitchImage('Quests','QuestsOff')">   <img id="Quests" name="Quests" src="http://www.chrisfries.net/thedarkdragons/fansite/images/Buttons/quests-unactive.png" width="97" height="25" border="0" alt="Quests"></a><br><br>

With the javascript, just copy-n-paste that for each set of images you need this for and keep it within the curly brackets and your fine. Likewise, with the HTML, just use that as much as you need, replace all the "Quests" with the respective new "name" in the script and html and you're off and running. Make sure you match your cases.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...