Solved

HTML Code to Change Text Mouse Over or Hover???

Posted on 2011-02-26
4
966 Views
Last Modified: 2012-05-11
I have a basic webpage that was created with Yahoo Sitebuilder.  I am using Text to navigate the various pages (Home, Projects, Experience and Contact Us).  What I'm trying to do is add HTML code to the existing Text Links code to change the text color on Mouse Over or Hover.   The Sitebuilder code will allow additional HTML codes Before, Inside or After the code automatically generated to create the Text link to the various pages as shown in the image below.

I've tried adding the HTML below in the Before, Inside and After to no avail.

<style type="text/css">
A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}
A:hover {text-decoration: underline; color: red;}
</style>

Any help will be appreciated.

ET HTML Code
0
Comment
Question by:Eric Sherman
  • 3
4 Comments
 
LVL 4

Expert Comment

by:florjan
ID: 34988546
a:link {text-decoration: none}
a:visited {text-decoration: none}
a:active {text-decoration: none}
a:hover {text-decoration: underline; color: red;}

Open in new window

Does it work with lowercase a?
0
 
LVL 19

Author Comment

by:Eric Sherman
ID: 34988628
Thanks for the reply florjan ..

After further testing, here's what I'm getting ...

1.) I think I need to put that HTML code in the Page format rather than trying to include it with each of the text links.

2.) For the text links on the page that were created with Sitebuilder and left in their original state (meaning typical hyperlink blue and underline) the code seems to work on that page.

3.) The navigation buttons on the top of the page (Home, Projects, Experience and Contact Us) I changed their default color to white because they are sitting on a blue background and the default link color of blue will make it hard to see them.  For those, the hover event will not change the color from white to red but it will underline them on mouse over.

4.) I noticed where all hyperlinks on the page with that additional HTML code included will display without the underline as they are formatted to do so.


ET
0
 
LVL 19

Accepted Solution

by:
Eric Sherman earned 0 total points
ID: 34999170
Ok, I was originally thinking there was some basic HTML code out there that I could modify to accomplish this which is not the case.  

I found this DHTML menu generator that did the trick and actually builds some pretty neat Javascript web navigation menus for which you can easily incorporate on your website.

http://www.sothink.com/product/dhtmlmenu/

Thanks to all that replied to my original question.

ET
0
 
LVL 19

Author Closing Comment

by:Eric Sherman
ID: 35042615
I found this DHTML menu generator that did the trick and actually builds some pretty neat Javascript web navigation menus for which you can easily incorporate on your website.

http://www.sothink.com/product/dhtmlmenu/
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
HTML Relative path 9 33
How to loop bootstrap columns which contain database records 9 42
How to use embargo Date/time in php 29 39
CSS: Making responsive table look nicer 7 27
This article discusses four methods for overlaying images in a container on a web page
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question