Text rollovers

admin

Administrator
Staff member
hey, first of all I'm new here *waves*<br />
<br />
um, I got a question. Is it possible to have rollovers on plain text??? let me know, any help would be appreciated!<br />
<br />
Sarah<!--content-->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.<br />
<span onMouseOver="style.color='#ffffff';"<br />
onMouseOut="style.color='#000000';" stlye="color:#000000;">Text here</span> <br />
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.<!--content-->This will change the actual text... I had to do a little digging to figure out how to do this one<br />
<br />
<span onmouseover="this.innerText='bye'" onmouseout="this.innerText='hi'">hi</span><br />
<br />
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.<!--content-->The easy, cross browser, but not DOM compliant way:<br />
<br />
<span onmouseover="this.innerHTML='bye'" onmouseout="this.innerHTML='hi'">hi</span><br />
<br />
The harder, DOM compliant way:<br />
<br />
<span onmouseover="this.firstChild.data='bye'" onmouseout="this.firstChild.data='hi'">hi</span><br />
<br />
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:<br />
<br />
this.appendChild(document.createTextNode('text'));<br />
<br />
And the code needed changes as the situation changes...<!--content-->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:<br />
<br />
the two text links right at the bottom of the page, put your mouse over it and text will pop up, something like that.<!--content-->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<br />
<a href=http://www.webdeveloper.com/forum/archive/index.php/"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?<!--content-->Dynamic Drive has free scripts that will show text description in boxes on mouseover of text:<br />
<!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m --><!--content-->Originally posted by starrwriter <br />
Dynamic Drive has free scripts that will show text description in boxes on mouseover of text:<br />
<!-- m --><a class="postlink" href="http://www.dynamicdrive.com">http://www.dynamicdrive.com</a><!-- m --> Dynamic drive is notorious for having buggy code and invalid code, I would use them as little as possible.<!--content-->Originally posted by PeOfEo <br />
Dynamic drive is notorious for having buggy code and invalid code, I would use them as little as possible. <br />
<br />
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.<!--content-->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.<!--content-->Originally posted by PeOfEo <br />
Dynamic drive is notorious for having buggy code and invalid codeYou 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 Download <!--more-->able scripts, though) but I'm not sure I'd say thy are "notorious for having buggy code"...<!--content-->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.<!--content-->So let me get this straight... You like HTMLGoodies but don't like Dynamic Drive? Interesting...<!--content-->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.<!--content-->So what I'm hearing is this:<br />
<br />
The content at HTMLGoodies sucks, but it is easy to read/understand, so that must make it good? Umm.. OK.<br />
<br />
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...<!--content-->The fact that you can understand what the site says is good for a novice. You dont want someone on their first day of webdesign at the wc3 reading with big terms flying around 'extencible markup language, cascading style sheets' etc. Also maybe you were not on the goodies forums, but several of the people here were, like I belive dave clark was, I think charles was, etc.<!--content-->that still isn't what I'm trying to do. Never mind *lol*<!--content-->If you try to explain what you need better, or can point us to an example, we can probably get you some code...<!--content-->
 
Back
Top