470,594 Members | 1,634 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 470,594 developers. It's quick & easy.

Transparency problem in IE7 with Hover

170 100+

I've googled for this answer but I don't think I know the right search phrase to type...

I have a fairly simple hover effect. When the user mouses over a link, a box appears with extra info. This works for all browsers. However, in IE7 only, it's as if the transparency is set to 60%. In other words, I can still see the text which is present without hovering. In FF, Safari, Chrome etc, it's totally blocked out when I hover.

Is there some way of completing blocking it out in IE7? I've put the style listing below.


Expand|Select|Wrap|Line Numbers
  1. span.hovercal {position: fixed;}
  2. span.hovercal a span {     display: none;}
  3. span.hovercal a:hover {         color: blue;    text-decoration:none;}
  4. span.hovercal a:hover span { 
  5.     display: block; 
  6.         position: fixed; 
  7.         left:10px;
  8.         top:250px;
  9.         margin-top: 5px; 
  10.         margin-left: 5px; 
  11.         width: 400px; 
  12.         height:300px;
  13.         padding: 5px; 
  14.         z-index: 100; 
  15.         color: #fff; 
  16.         background: #90c; 
  17.         text-decoration:none;
  18.         cursor:default;
  19.         text-align:left;
  20. }
May 4 '09 #1
0 1429

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

2 posts views Thread by Cecile Muller | last post: by
3 posts views Thread by Mr. x | last post: by
2 posts views Thread by Jusbo | last post: by
20 posts views Thread by Nathan Sokalski | last post: by
6 posts views Thread by tommaso.gastaldi | last post: by
reply views Thread by ZikO | last post: by
3 posts views Thread by Martijn Mulder | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.