SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    using jQuery to support :focus in IE - a quick way?

    I have a number of effects that I am using the CSS :focus pseudo class to achieve in all browsers except, of course, for clunky old IE.

    In the past I've used something like this:

    #element a:hover, #element a:focus, #element a.focus {}

    and then used jQuery to fill in the gaps using:

    $("#element").focus(function(){
    $(this).addClass("hover");
    }).blur(function(){
    $(this).removeClass("hover");
    });

    But this means that I have to add a lot of these CSS styles and associated functions. What I am wondering is whether there is a way I can do something like this in jQuery (pseudo code):

    Find
    all elements/selectors that have a :focus style specified in CSS
    then apply/remove that style using
    this.focus and this.blur

    I can't think how this is possible, but if it *were* possible, a few lines of jQuery could reduce the need for applying multiple styles for :hover, :focus and a class that does the same thing as :hover/:focus

    Does this make sense?

    If anyone has any bright ideas, I'd love to hear them :-)
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  2. #2
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Giving this another nudge, just in case anyone has any bright ideas :-)
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  3. #3
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)

  4. #4
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Jimmy, that looks pretty interesting. I hope that it proves to be useful to others too.

    Just one comment - the code has a (c) symbol, no license details to speak of (unless I missed that). I presume that you want to be credited for it, but not intending that it is restricted in how it's used? I'm not too hot on licensing issues but if I see a (c) symbol it will definitely make me think twice about going ahead ...
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  5. #5
    Function Curry'er JimmyP's Avatar
    Join Date
    Aug 2007
    Location
    Brighton, UK
    Posts
    2,006
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just PM'd you
    James Padolsey
    末末末末末末末末末末末末末末末末末末末
    Awesome JavaScript Zoomer (demo here)
    'Ajaxy' - Ajax integration solution (demo here)


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
  •