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 to the CF scene
    Join Date
    May 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    css images rollover not working on IE

    Hi

    My rollover css works on FF but not on IE.
    can someone help?


    here it is:

    <div class="rollover"><a onclick="s2fOpt(this)">&nbsp;</a></div>

    the style:

    .rollover a {
    display:block;
    width: 250px;
    height:59px;
    background: url("/i/s0.gif");
    text-decoration: none;
    }
    .rollover a:hover {
    display:block;
    width: 250px;
    height:59px;
    background: url("/i/s1.gif");
    text-decoration: none;

    }
    .rollover a:active {
    display:block;
    width: 250px;
    height:59px;
    background: url("/i/s2.gif");
    text-decoration: none;
    }

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    I think for it to work in IE there needs to be a href in the link
    Code:
    <a href="#" onclick="s2fOpt(this);return false">&nbsp;</a>
    The return false is needed so the link doesn't go anywhere.
    Last edited by _Aerospace_Eng_; 05-09-2006 at 09:00 AM.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New to the CF scene
    Join Date
    May 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks
    But now I have a dotted border when clicking the image - in FF.

  • #4
    Senior Coder
    Join Date
    Feb 2003
    Posts
    1,665
    Thanks
    0
    Thanked 27 Times in 25 Posts
    That's often referred to as the 'focus border'.

    Try adding this to your css...
    Code:
    a[onclick*=s2fOpt]:focus {
    	outline: none;
    }
    (There is also a method to remove the focus border with js, but not without drastically reducing the accessibility of the link itself.)

    If the element only performs a js function, you may well be better off not using an anchor element. Attach the onclick event to some other non-semantic, non-functioning element - preferably one placed on the page using js (to avoid giving users without js a dead, [un]clickable device).

  • #5
    New to the CF scene
    Join Date
    May 2006
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks
    Work great for me


  •  

    Posting Permissions

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