Shoutbox

Hyperlink Text Rollover Effect - Printable Version

-Shoutbox (https://shoutbox.menthix.net)
+-- Forum: MsgHelp Archive (/forumdisplay.php?fid=58)
+--- Forum: Skype & Technology (/forumdisplay.php?fid=9)
+---- Forum: Tech Talk (/forumdisplay.php?fid=17)
+----- Thread: Hyperlink Text Rollover Effect (/showthread.php?tid=28238)

Hyperlink Text Rollover Effect by Dan on 07-06-2004 at 05:53 PM

I want to create a Hyperlink that is like this:

Before the text is rolled over, it appears as '- Home'.

But when someone hovers the mouse over the text it changes to '+ Home'. So basically it changes from '-' to '+'.

I was told by somebody that this is done using JavaScript, but I'm still not sure on how to do it.

Any help would be greatly appreciated, thank you.


RE: Hyperlink Text Rollover Effect by .blade// on 07-06-2004 at 06:03 PM

quote:
Originally posted by Dan
I want to create a Hyperlink that is like this:

Before the text is rolled over, it appears as '- Home'.

But when someone hovers the mouse over the text it changes to '+ Home'. So basically it changes from '-' to '+'.

I was told by somebody that this is done using JavaScript, but I'm still not sure on how to do it.

Any help would be greatly appreciated, thank you.


I am a little rusty in my Java, but a good site for HTML, DHTML and Java is http://www.jalfrezi.com
That site has almost every HTML, DHTML tag and some JAVA in a very user-friendly layout.
RE: Hyperlink Text Rollover Effect by KeyStorm on 07-06-2004 at 09:01 PM

quote:
Originally posted by blade
I am a little rusty in my Java, but a good site for HTML, DHTML and Java is http://www.jalfrezi.com
That site has almost every HTML, DHTML tag and some JAVA in a very user-friendly layout.

STFU, blade. If you don't know about Java, don't talk about it. Even in the case you meant Javascript by any chance (what is 100% sure).

If you don't know, don't post and don't spam!
RE: Hyperlink Text Rollover Effect by Eljay on 07-07-2004 at 04:30 PM

I think you mean like this

<A HREF="http://vexonet.com/index.php">
<FONT onMouseOver="this.innerHTML = '+Home'"
      onMouseOut="this.innerHTML = '-Home'">Home</FONT></A>


RE: Hyperlink Text Rollover Effect by user27089 on 07-07-2004 at 05:06 PM

quote:
Originally posted by KeyStorm
quote:
Originally posted by blade
I am a little rusty in my Java, but a good site for HTML, DHTML and Java is http://www.jalfrezi.com
That site has almost every HTML, DHTML tag and some JAVA in a very user-friendly layout.

STFU, blade. If you don't know about Java, don't talk about it. Even in the case you meant Javascript by any chance (what is 100% sure).

If you don't know, don't post and don't spam!
and what you just did is spam? so what are you doing>?<....

quote:
Originally posted by leejeffery
I think you mean like this

<A HREF="http://vexonet.com/index.php">
<FONT onMouseOver="this.innerHTML = '+Home'"
      onMouseOut="this.innerHTML = '-Home'">Home</FONT></A>
dreamweaver :dodgy:
code:

  <a href="link.html"
   onMouseOver="+HOME"
   onMouseOut="-HOME">

   - HOME

  </a>


RE: RE: Hyperlink Text Rollover Effect by RaceProUK on 07-07-2004 at 08:07 PM

quote:
Originally posted by traxor
code:

  <a href="link.html"
   onMouseOver="+HOME"
   onMouseOut="-HOME">

   - HOME

  </a>


I think that's the best solution placed on this page so far. Certainly what I'd choose.

EDIT: Just noticed you missed the 'this.innerHTML' stuff
RE: Hyperlink Text Rollover Effect by fluffy_lobster on 07-08-2004 at 11:13 AM

It would be if it worked :-/ :-/ :-/

The onmouseover and onmouseout properties define javascript or vbscript commands to execute.  That solution does nothing.  Traxor, I think you really need to stick to answering questions you can answer, because, yes, answering every question you see is called spam.  What does the best working example have to do with dreamweaver?

The innerHTML property is the easiest way to swap code, and I'd recommend that way.  If you wanted a more universal solution (to include the paranoid anti-js'ers :P) you could probably do it with CSS but it would be fiddly and JS is far easier.


RE: Hyperlink Text Rollover Effect by Dan on 07-08-2004 at 06:00 PM

<a href="home.html"
onMouseOver="this.innerHTML = '+ Home'"
onMouseOut="this.innerHTML = '- Home'">
- Home
</a>

Done it now, thanks everyone