SitePoint Sponsor |
|
User Tag List
Results 1 to 6 of 6
Thread: Weird mouseover CSS issue
-
Sep 30, 2004, 14:53 #1
- Join Date
- Aug 2004
- Location
- All over really :)
- Posts
- 205
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Weird mouseover CSS issue
Hello.
On my site: http://www.eye-floaters.com. On the left is a navigational div tag that specifies when the mouse moves over this tag the background colour changes. This works fine, however when the colour changes the voting poll underneath moves down a few pixels (and continues to move down as one moves the mouse over the div tag!).
It works fine in Opera, but not at all in IE. I'm absolutely stumped here folks, no idea what the issue is!
Can anyone please help?
-
Sep 30, 2004, 16:21 #2
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi,
Sorry but it looks like a javascript problem which is not my area. If you take this line out:
<script language="JavaScript" type="text/javascript" src="<A href="http://www.eye-floaters.com/code/changeimage.js"></script">http://www.eye-floaters.com/code/changeimage.js"></script>
Then the page is fine.So you need to look into the js routines and see whats going on.
Paul
-
Sep 30, 2004, 16:28 #3
- Join Date
- Aug 2004
- Location
- All over really :)
- Posts
- 205
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Weird.
But the mousover works fine everywhere else where there isn't a poll, and if I take out the script lines then it wont work at all.
I'll have another look at the scripts and see, just in case.
-
Sep 30, 2004, 16:55 #4
- Join Date
- Aug 2004
- Location
- All over really :)
- Posts
- 205
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Ok, ive changed the script into CSS instead:
Code:onmouseover="this.className='lhconttableover'" onmouseout="this.className='lhcont
It must be the whole left column code, for which the initial DIV tag is set as:
Code:<DIV id="lhcol">
-
Oct 1, 2004, 07:21 #5
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Wow - That took some finding - I must be losing my touch
IE is loosing the height of the nested ul and is reapplying the top and bottom padding each time which is causing the movement of the element belows. If you take out the padding from the list elements the menu becomes stable but obviously tou want the padding in there.
However the usual fix seems to work so add this code to the end of your stylesheet and it should cure the problem.
Code:/* commented backslash mac hiding hack \*/ .lhconttableover LI,.lhcont LI {height:1%;} /* end hack */
Paul
BTW your list is incorrectly constructed: Sublists should be like this:
<ul>
<li>
<ul>
<li></li>
</ul>
</li>
</ul>
-
Oct 1, 2004, 08:07 #6
- Join Date
- Aug 2004
- Location
- All over really :)
- Posts
- 205
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Super.
I actually fixed it by replacing the cell padding just before you post, but I only did by luck, just messing around with the code.
Your suggestion is tidier, and i'll fix my tags right away.
Cheers
Bookmarks