Can anyone help with the error shown below? - I have looked at the code of the script and realise that it is being generated by there being no valid id.
So... I changed the details to provide a valid id (did not work), then matched all the details up to a new id (did not work), then copied several classes with the same name and created id values for them (did not work).
Am I missing something here, or is this just another of those darn stupid issues that only affects IE browsers (Firefox does not generate the error) and which can (usually) just be ignored?
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
Timestamp: Sat, 4 Sep 2010 22:13:20 UTC
Message: 'document.getElementById(...)' is null or not an object
Line: 8
Char: 3
Code: 0
URI: http://litez.co.uk/skins/LDW/scripts/femenus.js
The script in question is as follows:
//SuckerTree Vertical Menu 1.1 (Nov 8th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/
var menuids=["skin_fenav1"] //Enter id(s) of SuckerTree UL menus, separated by commas
function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
for (var t=0; t<ultags.length; t++){
ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item
else //else if this is a sub level submenu (ul)
ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it
ultags[t].parentNode.onmouseover=function(){
this.getElementsByTagName("ul")[0].style.display="block"
}
ultags[t].parentNode.onmouseout=function(){
this.getElementsByTagName("ul")[0].style.display="none"
}
}
for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars
ultags[t].style.visibility="visible"
ultags[t].style.display="none"
}
}
}
if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)
...and the CSS for the above is:
.skin_fenav ul {
color: inherit;
background-color: inherit;
padding: 0px;
margin: 0px 0px 10px 0px;
list-style: none;
width: auto;
}
.skin_fenav ul li {
color: inherit;
background-color: inherit;
padding: 0px;
margin: 0px;
border-bottom: 1px solid #CDCDCD;
list-style: none;
position: relative;
}
.skin_fenav ul li a {
color: black;
line-height: 150%;
background-color: inherit;
font-weight: normal;
display: block;
text-decoration: none;
padding: 3px 5px 3px 5px;
overflow: auto; /*force hasLayout in IE7 */
}
.skin_fenav ul li a:hover {
color: blue;
background-color: #CCCCCC;
text-decoration: none;
}
.skin_fenav ul li ul {
position: absolute;
width: 130px; /*sub menu width*/
top: 4px;
visibility: hidden;
background-color: #FFFFFF;
background-repeat: repeat;
border: 2px solid #C2C2C2;
z-index: 4;
}
.subfolderstyle {
background: url('../media/menu_arrow.png') no-repeat center right;
width: 93%;
}