Text color changes on rollover

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • blazewalker
    New Member
    • Nov 2011
    • 3
    #1

    Text color changes on rollover

    I am working on a project for grad school that has me creating a webpage that needs to have a small javascript element that I'm having a lot of trouble with.

    I need to make a link in Javascript that lets the user hover over the link, and when the mouse is over it, the color changes from blue (the regular) to white, but when the text is rolled over, it needs to have a dark green highlight.

    So I need to go from a regular blue hyperlink with no highlight to a white texted green highlighted hyperlink, using Javascript.

    Hopefully someone out there can help, there is nothing in my textbook about it. I've been using these two resources from the internet, but cannot get it to work.

    http://www.javascriptk it.com/script/script2/highlight.shtml

    http://www.rgagnon.com/jsdetails/js-0055.html

    Each do something that I need to do, but neiter do both at the same time and I'm trying to put them together but they do not work.
    Tags: grad, html, java, javascript
    • Rabbit
      Recognized Expert MVP
      • Jan 2007
      • 12517
      #2
      What do you have so far?

        Comment

        • omerbutt
          Contributor
          • Nov 2006
          • 638
          #3
          hi blaze,
          I need to make a link in Javascript that lets the user hover over the link, and when the mouse is over it, the color changes from blue (the regular) to white,
          your start of the statement confuses with the ending part
          but when the text is rolled over, it needs to have a dark green highlight.
          what do you want that when the text is rolled over the color changes from blue to white or dark green and where is your code that you have written please paste it here
          regards
          ,
          Omer Aslam
          Last edited by acoder; Nov 29 '11, 08:49 AM.

            Comment

            • blazewalker
              New Member
              • Nov 2011
              • 3
              #4
              What I need to have is

              FIRST (with no rollover)
              Blue text (like a regular hyperlink
              SECOND (when the mouse is over)
              White Text with a green highlight

              Sorry, I was having trouble formulating it into a paragraph. Haha, hopefully this will help.

                Comment

                • omerbutt
                  Contributor
                  • Nov 2006
                  • 638
                  #5
                  text with a green HIGHLIGHT , where do you got such an assignment , :d may be some thing else you want to say but not finding the right words , making text color change on hover does not require any javascript , you can have this working trough a css hover class butt adding hightlight / shadow are different and never cross browser , but you need to look to jquery for that , i seriously never heard of the term highlighting the text
                  Last edited by omerbutt; Nov 28 '11, 07:45 PM. Reason: typo mistakes

                    Comment

                    • blazewalker
                      New Member
                      • Nov 2011
                      • 3
                      #6
                      I know, I am adept in CSS, and would LOVE if they would let me use CSS. This professor is crazy. He wants a green highlight on rollover, and white text to go with that green highlight. It's just odd, and I've been looking all over the internet and I'm only finding bits and pieces, and I cannot figure out how to put them together.

                        Comment

                        • omerbutt
                          Contributor
                          • Nov 2006
                          • 638
                          #7
                          i cant figure out the HIGHLIGHT blazewalker :D , i just cant get the concept that how the text is going to be hightlighted , changing color makes sense but what kind of effect is highlight , i cant get it
                          regards,
                          Omer Aslam

                            Comment

                            • Rabbit
                              Recognized Expert MVP
                              • Jan 2007
                              • 12517
                              #8
                              By highlight, he means change the background color of the text.

                                Comment

                                • omerbutt
                                  Contributor
                                  • Nov 2006
                                  • 638
                                  #9
                                  By highlight, he means change the background color of the text.
                                  if this is what you mean blazewalker try this
                                  Code:
                                  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<style type="text/css">
	a{
		display:block;
	}
</style>
<script type="text/javascript">
function changeColor(eleObj,status){
	if(status){
		eleObj.style.backgroundColor='green';
		eleObj.style.color='white';
	}else{
		eleObj.style.backgroundColor='white';
		eleObj.style.color='blue';
	}
}
</script>
<body>
<div>
	<a href="#." onmouseover="changeColor(this,1);" onmouseout="changeColor(this,0)">This is a link</a>
</div>
</body>
</html>
                                  regards,
                                  Omer Aslam

                                    Comment

                                    Previous template Next
                                    Working...