Sprite-based menu doesn't seem to work within a position:fixed div
I've found allot of helpful things on this site for making a fixed po开发者_开发技巧sition menu and for doing a sprite based rollover menu. Now, I'm trying to combine the two and it doesn't seem to work. Within the fixed position div, the background image used for the menu items doesn't move or allow me to change position either through code or on hover. Any advice is greatly appreciated.
The Css:
.Interact a {width: 143px; height: 24px; display: block; border: solid 0px #000;background: url(#IMG#);background-repeat:no-repeat;position:relative;background-attachment:scroll;}
.Q a:link, .Q a:visited{background-position:0 0;}
.Q a:hover {background-position: 0 -24;}
.floating-menu {position:fixed;top:-10;background:#FFF;border:1px solid #000;width:100px;z-index:11;}
.floating-menu a, div.floating-menu h3 {display:block;margin:0;}
The HTML:
<div class="floating-menu">
<h4>Menu</H4>
<div class="Interact Q"><a href="#"><img s rc="#BLANKIMG#" width=143 height=24></a></div>
</div>
精彩评论