Reply
help with onmouseover images
Old 05-27-2004, 07:27 PM help with onmouseover images
ricanbeans's Avatar
Novice Talker

Posts: 5
Location: Somewhere between here and there
i know a little bit about onMouseOver images and with forum utton images, but i cant figure something out. I want a onMouseOver images for a form button. Can this be done?
__________________
<!-- Sometimes I wonder if I am the computer, or if the computer is me -->
ricanbeans is offline
Reply With Quote
View Public Profile Visit ricanbeans's homepage!
 
When You Register, These Ads Go Away!
Old 05-27-2004, 07:47 PM
Unknown.

Posts: 1,693
You should be able to do it using the following code...

First enter this before the </head> tag....

Code:
<script language="JavaScript">
<!--
function namosw_exchange_src(name, rpath, nsdoc) 
{ 
  str = (navigator.appName == 'Netscape') ? nsdoc+'.'+name : 'document.all.'+name;
  img = eval(str);
  if (img) {
    if (img.altsrc == null) {
      img.altsrc = img.src;
      img.src    = rpath;
    } else {
      var temp   = img.src;
      img.src    = img.altsrc;
      img.altsrc = temp;
    }
  } 
}

function namosw_preload_img()
{ 
  var img_list = namosw_preload_img.arguments;
  if (document.preloadlist == null) 
    document.preloadlist = new Array();
  var top = document.preloadlist.length;
  for (var i=0; i < img_list.length; i++) {
    document.preloadlist[top+i]     = new Image;
    document.preloadlist[top+i].src = img_list[i];
  } 
}

//-->
</script>
Now the code for the form and rollover image URLS... after the <body> tag

Code:
<form name="FORMNAME" method="post" action="ENTER SCRIPT URL"
 onsubmit="return emailCheck(this.email.value)">
<p><a href="javascript:document.FORMNAME.submit();"
 onmouseout="namosw_exchange_src('image1', 'ENTER URL IMAGE 2', 'document')"
 onmouseover="namosw_exchange_src('image1', 'ENTER URL IMAGE 2', 'document')"><img src="ENTER URL IMAGE 1"
 width="ENTER WIDTH" height="ENTER HEIGHT" border="0"  name="image1"></a></p>
You just need to then change the...
  • FORMNAME
  • SCRIPT URL
  • IMAGE 1 URL (The original image)
  • IMAGE 2 URL (The rollover image)
  • HEIGHT and WIDTH

Then add your form fields

Hope this helps

James

Last edited by Dark-Skys99 : 05-27-2004 at 07:53 PM. Reason: Found Mistakes
Dark-Skys99 is offline
Reply With Quote
View Public Profile
 
Old 05-27-2004, 08:51 PM
Christopher's Avatar
Iced Cap

Latest Blog Post:
PHP and Unicode with UTF-8
Posts: 3,111
Location: Toronto, Ontario
Since you'll only ever need one form image (submit), why not just put the javascript inline?

HTML Code:
<input type="image" src="default.gif" width="100" height="20" onmouseover="this.src='hover.gif'" />
Though it doesn't pre-load like Dark-Skys99's. I guess either will do
Christopher is offline
Reply With Quote
View Public Profile Visit Christopher's homepage!
 
Old 05-27-2004, 09:04 PM
ricanbeans's Avatar
Novice Talker

Posts: 5
Location: Somewhere between here and there
thanks, Dark-Skys99. it worked. i couldn't get the last one to work though. I guess it wont work on just one line.
__________________
<!-- Sometimes I wonder if I am the computer, or if the computer is me -->

Last edited by ricanbeans : 05-27-2004 at 10:28 PM. Reason: to clarify my post
ricanbeans is offline
Reply With Quote
View Public Profile Visit ricanbeans's homepage!
 
Reply     « Reply to help with onmouseover images
 

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off




   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML

 


Page generated in 0.13439 seconds with 12 queries