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 5 of 5
  1. #1
    New Coder
    Join Date
    Sep 2008
    Posts
    12
    Thanks
    1
    Thanked 0 Times in 0 Posts

    How to simulate an a:visited with JS onClick

    Hello,

    I have had a breeze through the search results and tried modifying some scripts but with no real success yet.

    What I am trying to do and why?
    • Create a visited appearance (style) to links using onClick
    • Why > I am using lightbox to call content for a design but require the links to be styled with
    Code:
    text-decoration: line-through;
    once they have been visited.
    • The JS script for a lot of lightbox versions will not recognise these links as visited (for some reason not known to me).

    I imagine the structure is something along the lines of:

    function = style
    onclick="function"

    Some nippy code to solve this would be ace. Thanks for your time.

    Lawrence

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    Any chance of some more details? Can't quite get a handle on what you need to do.

  • #3
    New Coder
    Join Date
    Sep 2008
    Posts
    12
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I would like to add a style to a link once it has been clicked. I would usually use CSS to create an a:visited style.

    I this problem the a:visited will not work because the page linked up is being served/loaded through lightbox

    In particular I would like to style the link with 'line-through' once it has been clicked.

    Hope that explains it a bit better.

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Posts
    1,404
    Thanks
    2
    Thanked 32 Times in 32 Posts
    In its simplest implementation:

    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</title>
    <style type="text/css">
    .visited {text-decoration: line-through;}
    </style>
    </head>
    <body>
    <a href="#null" onclick="this.className='visited'">foo</a>
    </body>
    </html>
    More systematic ways of doing this, but without a document to look at (or some more specific information) hard to design anything.
    Last edited by adios; 05-13-2009 at 03:25 PM.

  • Users who have thanked adios for this post:

    lawrencebrown (05-13-2009)

  • #5
    New Coder
    Join Date
    Sep 2008
    Posts
    12
    Thanks
    1
    Thanked 0 Times in 0 Posts
    This is just the ticket.

    Simple and easy. Perhaps I should buy a JS book!

    Thanks very much for your help Adios


  •  

    Tags for this Thread

    Posting Permissions

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