SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Zealot
    Join Date
    Jul 2008
    Posts
    122
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Changing css class of a link on click withing changing original code

    I currently have a normal link like

    Code:
    <a href="http://sitepoint.com" class="link">sitepoint</a>
    and when a user clicks on it I want to be able to change the "link" class to a different class. However, I don't want to add anything to the actual link html. Is it possible to do this using javascript without modifying the original link code?

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    How would you like to do it without any javascript either?

    Code css:
    a.link:active {
        background-color: silver;
    }
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    SitePoint Zealot
    Join Date
    Jul 2008
    Posts
    122
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by pmw57 View Post
    How would you like to do it without any javascript either?

    Code css:
    a.link:active {
        background-color: silver;
    }
    I'm also using zeroclipboard so that won't work. Do you have a javascript version? thanks for the help

  4. #4
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    To do it with javascript requires having some way to target the link. Do you have a sample test page from which an appropriate solution can be crafted for you?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  5. #5
    SitePoint Enthusiast
    Join Date
    Jul 2010
    Posts
    93
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Using jQuery:

    $('.link').click(function(){ $(this).addClass('clickedlink').removeClass('link') });

    Not tested, but something like that should do what you're after


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
  •