Actually, that line doesn't work in NS7 either. It was designed for NS6 and may or may not work in that browser. To make things more interesting, it does work sometimes, at least in a modified version I came up with. I tinkered with this script some more and found that it could be made to 'work all the time' by giving it additional opportunities. This requires (at least in my current working version) a soft reload of the page [window.location.reload(false)]. This still does not take care of another problem in FF, that of the folder images somtimes not showing up at all (being replaced with an empty or sometimes a filled disc symbol). These facts and other work I've done on this script incline me to think that the css property:
list-style-image:
Is simply not well supported in FF, especially its javascript implementation as:
object.listStyleImage="url('image.gif')"
If you would like to try out this script to see if you can live with it for your purposes, here it is (I am including the entire page, as the markup and style differ from the original too):
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Smart Fold Demo - III - Opera8, IE6 - Functional in: NS7, FF1.0.6</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
#foldheader{
cursor:pointer;cursor:hand;
font-weight:bold;
list-style-image:url('fold.gif'); /*set to closed folder image*/
}
#foldinglist{
list-style-image:url('list.gif'); /*set to sub items image*/
font-weight:normal;
}
-->
</style>
<script type="text/javascript">
<!--
//Smart Folding Menu tree - By Dynamic Drive (rewritten 9/15/2005 by jscheuer1)
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use
//Modified by jscheuer1 in http://www.dynamicdrive.com/forums
//for wider compatibility.
img1=new Image()
img1.src="fold.gif" //configure closed folder image
img2=new Image()
img2.src="open.gif" //configure open folder image
opWidth=16 //set to width of closed folder image (Affects Opera Only)
/////////////////// No Need to Edit Below Here /////////////
var Op8=window.opera
var ns6Op8=(document.getElementById&&!document.all)||Op8
var ie4=document.all&&!Op8
var openAlso='count'
Object.prototype.getNum=function (){
var count=0
var foldH=document.getElementsByTagName('li')
for (var i_tem = 0; i_tem < foldH.length; i_tem++){
if (foldH[i_tem]==this)
openAlso=count
if (foldH[i_tem].id=='foldheader')
count++
}
}
document.write('\n<style type="text/css">\n')
if (Op8)
document.write("#foldheader, #foldinglist{visibility:hidden;list-style-position:inside;position:relative;right:"+opWidth+"px;}\n")
document.write("#foldheader{list-style-image:url('"+img2.src+"')}\n</style>\n")
function checkcontained(e){
var iscontained=0
cur=ns6Op8? e.target : event.srcElement
if (cur.id=="foldheader")
iscontained=1
else
while (ns6Op8&&cur.parentNode||(ie4&&cur.parentElement)){
if (cur.id=="foldheader"||cur.id=="foldinglist"){
iscontained=(cur.id=="foldheader")? 1 : 0
break
}
cur=ns6Op8? cur.parentNode : cur.parentElement
}
if (iscontained){
var foldercontent=ns6Op8? cur.nextSibling.nextSibling : cur.all.tags("UL")[0]
if(!document.all&&!foldercontent){
cur.getNum()
window.location.reload( false );
return;
}
if (foldercontent&&foldercontent.style.display=="none"){
foldercontent.style.display=""
cur.style.listStyleImage="url('"+img2.src+"')"
}
else if (foldercontent){
foldercontent.style.display="none"
cur.style.listStyleImage="url('"+img1.src+"')"
}
}
if (Op8&&typeof c_item!=='undefined')
checkit();
}
if (ie4||ns6Op8)
document.onclick=checkcontained
onload=function(){
var ulis=document.getElementsByTagName? document.getElementsByTagName('ul') : document.all.tags('ul')
for (var i_tem = 0; i_tem < ulis.length; i_tem++)
if (ulis[i_tem].id=='foldinglist'){
if (Op8)
ulis[i_tem].style.visibility='visible'
ulis[i_tem].style.display="none"
}
var lis=document.getElementsByTagName? document.getElementsByTagName('li') : document.all.tags('li')
for (var i_tem = 0; i_tem < lis.length; i_tem++)
if (lis[i_tem].id=='foldheader'){
if (Op8)
lis[i_tem].style.visibility='visible'
lis[i_tem].style.listStyleImage="url('"+img1.src+"')"
}
}
//-->
</script>
</head>
<body>
<!-- Set Height and Width of containing division to avoid 'jumping' -->
<!--[if gte IE 6]>
<div style="height:400px;width:300px;">
<![endif]-->
<script type="text/javascript">
if (ns6Op8)
document.write('<div style="height:400px;width:300px;">')
</script>
<font face="Verdana">
<ul><!-- Set below image to closed folder image -->
<li id="foldheader" style="list-style-image:url('fold.gif');">News</li>
<ul id="foldinglist">
<li><a href="http://www.cnn.com">CNN</a></li>
<li><a href="http://www.abcnews.com">ABC News</a></li>
<li><a href="http://www.news.bbc.co.uk">BBC News</a></li>
</ul>
<li id="foldheader">Webmaster</li>
<ul id="foldinglist">
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
<li><a href="http://www.javascriptkit.com">JavaScript Kit</a></li>
<li><a href="http://www.freewarejava.com">Freewarejava.com</a></li>
</ul>
<li id="foldheader">Nested Example</li>
<ul id="foldinglist">
<li><a href="http://www.dynamicdrive.com">outer 1</a></li>
<li><a href="http://www.dynamicdrive.com">outer 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist">
<li><a href="http://www.dynamicdrive.com">nested 1</a></li>
<li><a href="http://www.dynamicdrive.com">nested 2</a></li>
</ul>
<li><a href="http://www.dynamicdrive.com">outer 3</a></li>
<li><a href="http://www.dynamicdrive.com">outer 4</a></li>
</ul>
</ul>
</font>
<!--[if gte IE 6]>
</div>
<![endif]-->
<script type="text/javascript">
if (ns6Op8)
document.write('</div>')
</script>
<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
<script type="text/javascript">
<!--
//optional persistence feature
function get_cookie(Name) {
//Get cookie routine by Shelley Powers
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
// if cookie exists
if (offset != -1) {
offset += search.length
// set index of beginning of value
end = document.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
var foldercontentarray=new Array()
var c_item=0
if (ns6Op8){
for (var i_item=0;i_item<document.getElementsByTagName("UL").length;i_item++){
if (document.getElementsByTagName("UL")[i_item].id=="foldinglist"){
foldercontentarray[c_item]=document.getElementsByTagName("UL")[i_item]
c_item++
}
}
}
if (get_cookie(window.location.pathname) != '')
onload=function(){
var ulis=document.getElementsByTagName? document.getElementsByTagName('ul') : document.all.tags('ul')
for (var i_tem = 0; i_tem < ulis.length; i_tem++)
if (ulis[i_tem].id=='foldinglist'){
if (Op8)
ulis[i_tem].style.visibility='visible'
ulis[i_tem].style.display="none"
}
var lis=document.getElementsByTagName? document.getElementsByTagName('li') : document.all.tags('li')
for (var i_tem = 0; i_tem < lis.length; i_tem++)
if (lis[i_tem].id=='foldheader'){
if (Op8)
lis[i_tem].style.visibility='visible'
lis[i_tem].style.listStyleImage="url('"+img1.src+"')"
}
openresults=get_cookie(window.location.pathname).split(" ")
for (j_item=0 ; j_item < openresults.length ; j_item++){
if (ns6Op8){
foldercontentarray[openresults[j_item]].style.display=''
if (!Op8)
setTimeout('openThem(j_item);', 0)
else
foldercontentarray[openresults[j_item]].previousSibling.previousSibling.style.listStyleImage="url('"+img2.src+"')"
}
else{
foldinglist[openresults[j_item]].style.display=''
document.all[foldinglist[openresults[j_item]].sourceIndex -1].style.listStyleImage="url('"+img2.src+"')"
}
}
}
function openThem(ul){
while (ul){
if (!document.all&&typeof foldercontentarray[openresults[ul-1]].previousSibling.previousSibling.style=='undefined'){
window.location.reload( false );
return;
}
foldercontentarray[openresults[ul-1]].previousSibling.previousSibling.style.listStyleImage="url('"+img2.src+"')"
ul--
}
}
if (ns6Op8||ie4){
var nodelength=ns6Op8? c_item-1 : foldinglist.length-1
var nodes=new Array(nodelength)
}
function checkit(){
var openones=''
for (var i_item=0 ; i_item <= nodelength ; i_item++){
if ((ns6Op8&&foldercontentarray[i_item].style.display=='')||(ie4&&foldinglist[i_item].style.display==''))
openones+= " " + i_item
}
if (openAlso!=='count')
openones+= " " + openAlso
document.cookie=window.location.pathname+"="+openones
}
if (ns6Op8||ie4)
window.onunload=checkit
//-->
</script>
</body>
</html>
Smart Folding Menu Tree Script & Firefox bug
Reply With Quote
Bookmarks