Forum Moderators: open
I've been working on a project that has some Javascript code in my HTML page that will make my navigation links work like folders. A click will expand the folder, and close them in any order.
The code does not have any errors, and works as designed in Firefox, Safari, Chrome, IE8, and I thought IE7.
In single-level folder menus, IE7 behaves like everyone else. However in IE7 I'm coming across the weirdest errors I can't figure out.
When I have a two layer folder menu: if I open two Sub Folders, and close a sub Folder positionally above another the one below it's link goes blank, the data is positioned below the content, and overflowing the table's lower end.
If I close and reopen the root Folder, everything sorts itself out and suddenly visibility is restored.
It's bugging me and I can't describe it better than in a picture:
Open SubFolder3:
-Folder1!
¦_SubFolder1
¦_SubFolder2
¦_SubFolder3
¦_Data3
Data3
Data3
Open SubFolder2:
-Folder1!
¦_SubFolder1
¦_SubFolder2
¦_Data2
Data2
Data2
¦_SubFolder3
¦_Data3
Data3
Data3
Close SubFolder2:
-Folder1!
¦_SubFolder1
¦_SubFolder2
¦_(NAME HAS DISAPPEARED)
¦_Data3 <-- Weird spacing
Data3
Data3
Close Folder1!, reopen Folder1!:
-Folder1!
-Folder1!
¦_SubFolder1
¦_SubFolder2
¦_SubFolder3
¦_Data3 <-- Ta da! Everything works again.
Data3
Data3
Thank you for time in reading this!
One of the rules set the nested links in each node to position: relative. When the links don't move it's fine, but when they do start to move it does not handle quite the same. Instead they start flying around the page. Removed the rule and applied it to the root div and everything began working as required.
Happy Holidays!