SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Sep 2004
    Location
    USA
    Posts
    161
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    changing link text to bold upon clicking

    Hello everyone,

    I have a navigation bar. It has some 20 links. I wish to make the current link bold. I mean when I click on the link, I want to make it bold and when I click on something else, I want to make the bold link normal.

    How do I do it? I tried using following function which I invoked on onclick event of <a> </a> tag. But when I click on somthing else bold text remains the same.

    Can yo suggest some ideas, Please??

    here is the script
    function selected_option(linkid)
    {
    document.getElementById(linkid).style.font="bold";
    }

  2. #2
    SitePoint Addict
    Join Date
    Apr 2002
    Posts
    281
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is one way to do it

    Code:
      
     
    var currElem = null; //will hold the element that is bold now
    
     function BoldText(elem) {
     
      if (elem != currElem) { //do thing if you're clicking on a bold link
    
       if (currElem) //if a link bold right now unbold it
    
    	currElem.style.fontWeight='normal';
    
       currElem = elem; //assign this element as the current one
    
       elem.style.fontWeight='bold';  //make the element clicked bold
     
      }
    
     }
    and the html

    Code:
     
     <a href="#" onclick="BoldText(this);">Some LInk</a>
     <a href="#" onclick="BoldText(this);">Link 2</a>

    hope this helps

  3. #3
    SitePoint Zealot
    Join Date
    Sep 2004
    Location
    USA
    Posts
    161
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks warjockey for your time, but this is not what I am looking for. When I click on link I want to make rest of the links to appear normal. I don't know how to achieve it.

  4. #4
    SitePoint Enthusiast
    Join Date
    May 2005
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Perhaps I'm misunderstanding things here, but wont a:active { font-weight: bold; } achieve what you're wanting?

  5. #5
    SitePoint Zealot
    Join Date
    Sep 2004
    Location
    USA
    Posts
    161
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried a:active{font-weight:bold;} too, nothing happened. I started with this only, but it didn't make any link bold, so I came up with the javascript function.

    Thanks though


Bookmarks

Posting Permissions

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