Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    pvz
    pvz is offline
    New Coder
    Join Date
    Oct 2003
    Posts
    80
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Changing the style (the color) of another link?

    How can I change the style (the color) of another link onmouseover?
    something like this:
    <a name="link1" href="page1.htm" onmouseover="changestyle('link2')">link1</a>
    <a name="link2" href="page2.htm">link2</a>
    Hope you can help! Thanks/P

  • #2
    Regular Coder
    Join Date
    Jan 2004
    Location
    London, UK
    Posts
    234
    Thanks
    0
    Thanked 0 Times in 0 Posts
    perhaps this may come in handy?
    Code:
    <script type="text/javascript">
         function tog(elemID){
              document.getElementById(elemID).style.display =
              (document.getElementById(elemID).style.display == 'none') ?
              'block' : 'none'
              }
    </script>
    
    <a href="#" onclick="tog('div1')">Style 1</a>
    <a href="#" onclick="tog('div2')">Stlye 2</a>
    <a href="#" onclick="tog('div3')">Style 3</a>
                  <div id="div1" class="class1"><a href="link.htm">THE SAME LINK</a></div>
                  <div id="div2" class="class2"><a href="link.htm">THE SAME LINK</a></div>
                 <div id="div3" class="class3"><a href="link.htm">THE SAME LINK</a></div>
    I know its not EXACTLY what you specified but its all i could think of.
    Last edited by newmand2; 02-15-2004 at 03:20 PM.

  • #3
    me'
    me' is offline
    Senior Coder
    Join Date
    Nov 2002
    Location
    Warwickshire, England
    Posts
    1,229
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Something like this?
    Code:
    <html>
    <head>
      <script>
      window.onload = function () {
        document.getElementById('changeomo').onmouseover = function(){
          document.getElementById('changedomo').style.color = '#f00'
        }
      }
      </script>
      ...
    </head>
    <body>
      ...
      <a href="#" id="changeomo">Hello</a>
      <a href="#" id="changedomo">World</a>
      ...
    </body>
    </html>
    David House - Perfect is achieved, not when there is nothing left to add, but when there is nothing left to take away. (Antoine de St. Exupery).
    W3Schools | XHTML Validator | CSS Validator | Colours | Typography | HTML&CSS FAQ | Go get Mozilla Now | I blog!

  • #4
    Regular Coder
    Join Date
    Dec 2003
    Location
    USA
    Posts
    230
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ah, silly me, mis-read the post.

  • #5
    pvz
    pvz is offline
    New Coder
    Join Date
    Oct 2003
    Posts
    80
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks. But is there really no way that I can define which link to change the style of in each case... Something like:

    onmouseover="changestyle('link2','#ffffff')"

  • #6
    Regular Coder
    Join Date
    Dec 2003
    Location
    USA
    Posts
    230
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is kinda rough draft...
    Code:
    <script type="text/javascript">
    function lite(name, color) {
    	document.getElementById(name).style.color=color;
    }
    </script>
    ...
    <a href="#" onmouseover="lite('link2', '#FFFFFF');" onmouseout="lite('link2', '#000000');">Link</a>
    <a href="#" id="link2">Link 2</a>
    That also requires you to give each link you want to change an ID. So I'm sure there's a better solution out there.

  • #7
    Regular Coder
    Join Date
    Jan 2004
    Location
    London, UK
    Posts
    234
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Just a quick question... Couldn't you just keep the links the same colour? Why is it that you want to do this? Not being nasty but just wondering.

    In PHP (I don't know whether you use PHP or have access to it etc) you can (i think) do this:

    PHP Code:
    switch($style) {

    case 
    'style1':
    echo (
    '<link href="style1.css" rel="stylesheet" type="text/css">');
    break;

    case 
    'style2':
    echo (
    '<link href="style2.css" rel="stylesheet" type="text/css">');
    break;

    case 
    'style3':
    echo (
    '<link href="style3.css" rel="stylesheet" type="text/css">');
    break;

    default:
    echo (
    '<link href="style.css" rel="stylesheet" type="text/css">');

    And then the links could be www.yourdomain.com/index.php?style=style1


    Just a thought


  •  

    Posting Permissions

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