www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 18

Thread: Text rollovers

  1. #1
    Join Date
    Sep 2003
    Location
    Aussie
    Posts
    4

    Question Text rollovers

    hey, first of all I'm new here *waves*

    um, I got a question. Is it possible to have rollovers on plain text??? let me know, any help would be appreciated!

    Sarah
    Last edited by Sarah005; 09-17-2003 at 08:37 PM.

  2. #2
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    welcome to the forum! I whiped up a little color swap for you, I dont know if this is exactly what you meant by 'rollover' did you want this or the text to actually change? Well here is my code for a color change on mouseover.
    Code:
    <span onMouseOver="style.color='#ffffff';"
    onMouseOut="style.color='#000000';" stlye="color:#000000;">Text here</span>
    I tested it and it worked fine, I just used the span element because it is inline and sort of designed for text, but you can also use a div, table cell, etc.
    Last edited by PeOfEo; 09-17-2003 at 08:54 PM.

  3. #3
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    This will change the actual text... I had to do a little digging to figure out how to do this one
    Code:
    <span onmouseover="this.innerText='bye'" onmouseout="this.innerText='hi'">hi</span>
    The problem with this though is it only works in ie from what I have seen so far. It does not work in mozilla which means you wont see it in netscape... Ok I take that back its not only IE it works in opera as well. Just know that it wont work on all browsers I guess.
    Last edited by PeOfEo; 09-17-2003 at 09:11 PM.

  4. #4
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    The easy, cross browser, but not DOM compliant way:

    <span onmouseover="this.innerHTML='bye'" onmouseout="this.innerHTML='hi'">hi</span>

    The harder, DOM compliant way:

    <span onmouseover="this.firstChild.data='bye'" onmouseout="this.firstChild.data='hi'">hi</span>

    Why is the second way harder? Because if you don't have any text inside the span, you will need something totally different. Something like this:

    this.appendChild(document.createTextNode('text'));

    And the code needed changes as the situation changes...

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  5. #5
    Join Date
    Sep 2003
    Location
    Aussie
    Posts
    4
    thanx but that wasn't what I meant *lol* I mean, you know how you put the pointer over a image or link and text pops up?? I wanna know how to do that (if it's possible) with plain text. For eg:

    the two text links right at the bottom of the page, put your mouse over it and text will pop up, something like that.

  6. #6
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    Links at the bottom of the thread, are you referring to the images? The reasont they do this is because ie is missreading the alt tag, use title="text". You can use
    <a href="url" title="the text that will popup">Link Text</a> In a text link or an image. Now to do it with normal text, what are you looking for? Do you want normal text to just popup??? Do you want to be able to change the colors or something, what exactly do you want this text to do?

  7. #7
    Join Date
    Feb 2003
    Location
    Honolulu, Hawaii
    Posts
    200
    Dynamic Drive has free scripts that will show text description in boxes on mouseover of text:
    http://www.dynamicdrive.com

  8. #8
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    Originally posted by starrwriter
    Dynamic Drive has free scripts that will show text description in boxes on mouseover of text:
    http://www.dynamicdrive.com
    Dynamic drive is notorious for having buggy code and invalid code, I would use them as little as possible.

  9. #9
    Join Date
    Feb 2003
    Location
    Honolulu, Hawaii
    Posts
    200
    Originally posted by PeOfEo
    Dynamic drive is notorious for having buggy code and invalid code, I would use them as little as possible.
    I disagree entirely. I have used many scripts from Dynamic Drive in the past 4 years and I can't recall a single one that didn't work.

  10. #10
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    Did you test them on mozilla opera or netscape. Did you run them through the wc3 validator. I have found many bugs in the dynamic drive scripts in the past, for example take a gander at their preloading pages, those are way screwed up.

  11. #11
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    Originally posted by PeOfEo
    Dynamic drive is notorious for having buggy code and invalid code
    You sure you're not thinking of htmlgoodies? I'm sure most of the code at Dynamic Drive could be improved (seems to be that way with all downloadable scripts, though) but I'm not sure I'd say thy are "notorious for having buggy code"...

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  12. #12
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    I am not talking about the tutorials, I am talking about the code snippets the manufacutred ones that you just copy and paste to your site. HTML goodies may not be very accurate but they are a good intro into web design, its an easy place if you want to learn the basic prinicples. I mean compare goodies with some of the other tutorial sites out there, goodies is a lot easier to understand if this is your first day of web design.

  13. #13
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    So let me get this straight... You like HTMLGoodies but don't like Dynamic Drive? Interesting...

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  14. #14
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    I didnt say that. I dont use goodies or dynamic drive, but I was just saying goodies does have one good point... despite some very crappy content it is easy for the computer illierate to understand. I did not know a think about websites and goodies was easy to read and plus it had the nice mento community and you and many others were on their forums for support.

  15. #15
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    So what I'm hearing is this:

    The content at HTMLGoodies sucks, but it is easy to read/understand, so that must make it good? Umm.. OK.

    Also, I've never been to the HTMLGoodies forums, so it wasn't me there fixing up all the problems that people have due to the code...

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles