Tweet
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Q_21155737</title>
<style type="text/css">
ul {list-style-position:inside;padding-left:1em;}
li.closed {list-style-image:url("/images/icon_folder_closed.png");}
li.closed > ul {display:none;}
li.open {list-style-image:url("/images/icon_folder_open.png");}
li.open > ul {display:block;}
li {list-style-image:url("/images/icon_file.png");}
</style>
</head>
<body>
<ul id="directory">
<li><a href="">Folder 1</a>
<ul>
<li><a href="">Folder 1_1</a>
<ul>
<li><a href="">Item 1</a></li>
</ul>
</li>
<li><a href="">Folder 1_2</a>
<ul>
<li><a href="">Item 1</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="">Folder 2</a>
<ul>
<li><a href="">Folder 2_1</a>
<ul>
<li><a href="">Item 1</a></li>
</ul>
</li>
<li><a href="">Folder 2_2</a>
<ul>
<li><a href="">Item 1</a></li>
</ul>
</li>
</ul>
</li>
</ul>
<script type="text/javascript">
var list = document.getElementById("directory").getElementsByTagName("ul");
for(var i = 0; i < list.length; i++)
{
if(String(list[i].parentNode.nodeName).toLowerCase() == 'li')
{
list[i].parentNode.addEventListener("click",open,true);
var reg = new RegExp("(?:\\W|\\s)" + i + "(?:\\W|\\s|$)","g");
if(String(document.cookie).search(reg) == -1)
{
list[i].open = false;
list[i].parentNode.className = 'closed';
}
else
{
list[i].open = true;
list[i].parentNode.className = 'open';
}
}
}
function open(e)
{
e.stopPropagation();
e.preventDefault;
var i;
for(i = 0; i < list.length; i++)
if(list[i] == e.target.getElementsByTagName("ul")[0])
break;
list[i].open = (list[i].open) ? false : true;
list[i].parentNode.className = list[i].open ? 'open' : 'closed';
write_cookie();
}
function write_cookie()
{
var str = '';
for(var i = 0; i < list.length; i++)
{
if(list[i].open)
{
if(str.length > 0)
{
str += ',';
}
str += i;
}
}
document.cookie = "open_folders=" + str;
}
</script>
</body>
</html>
Comment