源代码如下,求高人给指点一下,或者解释整个代码更好。
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
<style type='text/css'>
.folder1 {text-align:center; background: #00A4E1; border: 5px outset; background-image:url(Images/skin/folder_bg.gif); border-color: #00BBFF #0077FF #FFFFFF #00BBFF; cursor: hand; font-size: 9pt}
.folder2 {text-align:center; background: #20C1FF; border: 5px outset; background-image:url(Images/skin/folder_bg.gif); border-color: #00BBFF #0077FF #0077FF #60D3FF; cursor: hand; font-size: 9pt}
.foldercont{background: #D9ECF4; border: 1px outset; border-color: #B0D8FF #0077FF #0077FF #B0D8FF; font-size: 9pt; cursor: default;}
</style><SCRIPT LANGUAGE=javascript>
onload=function(){
var lstr = ""
for (var i=0; i<10; i++) lstr+= "item-"+i+"<br>";
var lofolder = new outlookfolder(null,335,200,3);
lofolder.addfolder("菜单1","1..<br>2..");
lofolder.addfolder("菜单2",lstr);
lofolder.addfolder("菜单3");
lofolder.addfolder("菜单4");
lofolder.addfolder("菜单5");
lofolder.showfolderX(0);
}
//[容器,高,宽,展开速度]
function outlookfolder(aoP,aih,aiw,ait){
if (aih==null) aih=200;
if (aiw==null) aiw="100%";
if (ait==null) ait=10;
var loMain = document.createElement("<span style='overflow:hidden;height:"+aih+";width:"+aiw+"'></span>");
var lsUniqueID = loMain.uniqueID;
var loSlide = document.createElement("span");
loSlide.innerHTML = "<button onmouseout='"+lsUniqueID+".SlideClickStop()' onmousedown='"+lsUniqueID+".SlideClickStart();"+lsUniqueID+".SlideCilckup()' style='position:absolute;display:none;width:10;height:10'></button><button onmouseout='"+lsUniqueID+".SlideClickStop()' onmousedown='"+lsUniqueID+".SlideClickStart();"+lsUniqueID+".SlideCilckdown()' style='position:absolute;display:none;width:10;height:10'></button>";
var liContH = aih;
if (aoP==null){
document.body.appendChild(loMain);
document.body.appendChild(loSlide);
}else{
aoP.appendChild(loMain);
aoP.appendChild(loSlide);
}
//增加一个目录[名字,内容]
loMain.addfolder = function(str,cont){
var loPar = document.createElement("SPAN");
loPar.innerHTML = "<span onclick='"+lsUniqueID+".showme(this)' style='overflow:hidden;width:100%;' class='folder1'></span><span style='position:relative;overflow:hidden;width:100%;height:1' class='foldercont'></span>";
this.appendChild(loPar);
loPar.children[0].innerHTML = (str==null?" ":str);
loPar.children[1].innerHTML = (cont==null?" ":cont);
liContH -= parseInt(loPar.children[0].offsetHeight);
}
//打开/关闭第x个目录夹
loMain.showfolderX = function(aix){
loMain.showme(loMain.children[aix].children[0])
}
//打开/关闭当前obj所在的目录
loMain.showme = function(obj){
if (loMain.moving) return;
loMain.moving = true;
if (obj.bOpen){
obj.bOpen = false;
loMain.closefolder(obj.parentElement.children[1]);
obj.className = 'folder1';
}else{
obj.bOpen = true;
loMain.openfolder(obj.parentElement.children[1]);
obj.className = 'folder2';
var lxfolders = loMain.children;
for (var i=0; i<lxfolders.length; i++){
var loChild = lxfolders[i].children[0];
if(loChild.uniqueID!=obj.uniqueID){
lxfolders[i].children[1].style.height=1;
loChild.bOpen = false;
loChild.className = 'folder1';
}
}
}
loMain.SlideItemsAction(obj.parentElement.children[1]);
}
//为目录内容设置Slide
var loSlideItem = null;
var lbSlideing = false;
loMain.SlideCilckdown = function(){ //向下滚动
loSlideItem.scrollTop += 2;
if (!lbSlideing&&loSlideItem.scrollTop<loSlideItem.scrollHeight) setTimeout(lsUniqueID+'.SlideCilckdown()',1)
}
loMain.SlideCilckup = function(){ //向上滚动
loSlideItem.scrollTop -= 2;
if (!lbSlideing&&loSlideItem.scrollTop>0) setTimeout(lsUniqueID+'.SlideCilckup()',1)
}
loMain.SlideClickStart = function(){ //允许开始滚动
lbSlideing=false;
}
loMain.SlideClickStop = function(){ //强制停止滚动
lbSlideing=true;
}
loMain.SlideItemsAction = function(obj){
var loUp = loSlide.children[0];
var loDown = loSlide.children[1];
if (obj.scrollHeight<=liContH||obj.parentElement.children[0].bOpen!=true){
loUp.style.display="none";
loDown.style.display="none";
}else{
loSlideItem = obj;
var lxOffset = getTrueOffset(obj);
var lileft = lxOffset[0]+obj.offsetWidth-20;
var litop = lxOffset[1]+obj.offsetHeight+5;
with(loUp.style){
display="";
left=lileft;
top=litop;
}
with(loDown.style){
display="";
left=lileft;
top=litop+liContH-40;
}
}
}
//逐渐关闭obj所在的内容显示
loMain.closefolder = function(obj,ai){
if (ai==null) ai=liContH;
if (ai<ait){ obj.style.height=1; ai=1}
if (ai>1){
obj.style.height = ai;
ai -= ait;
setTimeout(lsUniqueID+'.closefolder('+obj.uniqueID+','+ai+')',1)
return;
}
loMain.moving = false;
}
//逐渐打开obj所在的内容显示
loMain.openfolder = function(obj,ai){
if (ai==null) ai=1;
if (liContH>ai){
obj.style.height = ai;
ai += ait;
setTimeout(lsUniqueID+'.openfolder('+obj.uniqueID+','+ai+')',1)
return;
}
loMain.moving = false;
}
function getTrueOffset(e){
var x=0; var y=0;
if(!e)return [x,y];
while(e){
x+=parseInt(e.offsetLeft);
y+=parseInt(e.offsetTop);
e=e.offsetParent;
}
return [x,y];
}
return loMain;
}
</SCRIPT>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
<style type='text/css'>
.folder1 {text-align:center; background: #00A4E1; border: 5px outset; background-image:url(Images/skin/folder_bg.gif); border-color: #00BBFF #0077FF #FFFFFF #00BBFF; cursor: hand; font-size: 9pt}
.folder2 {text-align:center; background: #20C1FF; border: 5px outset; background-image:url(Images/skin/folder_bg.gif); border-color: #00BBFF #0077FF #0077FF #60D3FF; cursor: hand; font-size: 9pt}
.foldercont{background: #D9ECF4; border: 1px outset; border-color: #B0D8FF #0077FF #0077FF #B0D8FF; font-size: 9pt; cursor: default;}
</style><SCRIPT LANGUAGE=javascript>
onload=function(){
var lstr = ""
for (var i=0; i<10; i++) lstr+= "item-"+i+"<br>";
var lofolder = new outlookfolder(null,335,200,3);
lofolder.addfolder("菜单1","1..<br>2..");
lofolder.addfolder("菜单2",lstr);
lofolder.addfolder("菜单3");
lofolder.addfolder("菜单4");
lofolder.addfolder("菜单5");
lofolder.showfolderX(0);
}
//[容器,高,宽,展开速度]
function outlookfolder(aoP,aih,aiw,ait){
if (aih==null) aih=200;
if (aiw==null) aiw="100%";
if (ait==null) ait=10;
var loMain = document.createElement("<span style='overflow:hidden;height:"+aih+";width:"+aiw+"'></span>");
var lsUniqueID = loMain.uniqueID;
var loSlide = document.createElement("span");
loSlide.innerHTML = "<button onmouseout='"+lsUniqueID+".SlideClickStop()' onmousedown='"+lsUniqueID+".SlideClickStart();"+lsUniqueID+".SlideCilckup()' style='position:absolute;display:none;width:10;height:10'></button><button onmouseout='"+lsUniqueID+".SlideClickStop()' onmousedown='"+lsUniqueID+".SlideClickStart();"+lsUniqueID+".SlideCilckdown()' style='position:absolute;display:none;width:10;height:10'></button>";
var liContH = aih;
if (aoP==null){
document.body.appendChild(loMain);
document.body.appendChild(loSlide);
}else{
aoP.appendChild(loMain);
aoP.appendChild(loSlide);
}
//增加一个目录[名字,内容]
loMain.addfolder = function(str,cont){
var loPar = document.createElement("SPAN");
loPar.innerHTML = "<span onclick='"+lsUniqueID+".showme(this)' style='overflow:hidden;width:100%;' class='folder1'></span><span style='position:relative;overflow:hidden;width:100%;height:1' class='foldercont'></span>";
this.appendChild(loPar);
loPar.children[0].innerHTML = (str==null?" ":str);
loPar.children[1].innerHTML = (cont==null?" ":cont);
liContH -= parseInt(loPar.children[0].offsetHeight);
}
//打开/关闭第x个目录夹
loMain.showfolderX = function(aix){
loMain.showme(loMain.children[aix].children[0])
}
//打开/关闭当前obj所在的目录
loMain.showme = function(obj){
if (loMain.moving) return;
loMain.moving = true;
if (obj.bOpen){
obj.bOpen = false;
loMain.closefolder(obj.parentElement.children[1]);
obj.className = 'folder1';
}else{
obj.bOpen = true;
loMain.openfolder(obj.parentElement.children[1]);
obj.className = 'folder2';
var lxfolders = loMain.children;
for (var i=0; i<lxfolders.length; i++){
var loChild = lxfolders[i].children[0];
if(loChild.uniqueID!=obj.uniqueID){
lxfolders[i].children[1].style.height=1;
loChild.bOpen = false;
loChild.className = 'folder1';
}
}
}
loMain.SlideItemsAction(obj.parentElement.children[1]);
}
//为目录内容设置Slide
var loSlideItem = null;
var lbSlideing = false;
loMain.SlideCilckdown = function(){ //向下滚动
loSlideItem.scrollTop += 2;
if (!lbSlideing&&loSlideItem.scrollTop<loSlideItem.scrollHeight) setTimeout(lsUniqueID+'.SlideCilckdown()',1)
}
loMain.SlideCilckup = function(){ //向上滚动
loSlideItem.scrollTop -= 2;
if (!lbSlideing&&loSlideItem.scrollTop>0) setTimeout(lsUniqueID+'.SlideCilckup()',1)
}
loMain.SlideClickStart = function(){ //允许开始滚动
lbSlideing=false;
}
loMain.SlideClickStop = function(){ //强制停止滚动
lbSlideing=true;
}
loMain.SlideItemsAction = function(obj){
var loUp = loSlide.children[0];
var loDown = loSlide.children[1];
if (obj.scrollHeight<=liContH||obj.parentElement.children[0].bOpen!=true){
loUp.style.display="none";
loDown.style.display="none";
}else{
loSlideItem = obj;
var lxOffset = getTrueOffset(obj);
var lileft = lxOffset[0]+obj.offsetWidth-20;
var litop = lxOffset[1]+obj.offsetHeight+5;
with(loUp.style){
display="";
left=lileft;
top=litop;
}
with(loDown.style){
display="";
left=lileft;
top=litop+liContH-40;
}
}
}
//逐渐关闭obj所在的内容显示
loMain.closefolder = function(obj,ai){
if (ai==null) ai=liContH;
if (ai<ait){ obj.style.height=1; ai=1}
if (ai>1){
obj.style.height = ai;
ai -= ait;
setTimeout(lsUniqueID+'.closefolder('+obj.uniqueID+','+ai+')',1)
return;
}
loMain.moving = false;
}
//逐渐打开obj所在的内容显示
loMain.openfolder = function(obj,ai){
if (ai==null) ai=1;
if (liContH>ai){
obj.style.height = ai;
ai += ait;
setTimeout(lsUniqueID+'.openfolder('+obj.uniqueID+','+ai+')',1)
return;
}
loMain.moving = false;
}
function getTrueOffset(e){
var x=0; var y=0;
if(!e)return [x,y];
while(e){
x+=parseInt(e.offsetLeft);
y+=parseInt(e.offsetTop);
e=e.offsetParent;
}
return [x,y];
}
return loMain;
}
</SCRIPT>
解决方案 »
- 为什么触发不了
- 最近得到了一段将HTML文档转换成DOM树的JAVAScript代码,但本人并不懂JS,请各位帮忙看看
- 求一个作验证的JS
- js面向对象编程访问对象属性
- 表格中有隐藏列时td.cellIndex的值?
- 各位老大:html,dhtml,xhtml,dtd,dom,xml模式之间的联系与区别以及发展历程?
- 在JavaScript中,嵌入以下ASP语句,为何显示的菜单项中多了一个问号?加急!!在线等!
- 用正则表达式怎样检测输入法为全角状态下的空格字符?
- 一个高挑战性问题¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥¥
- 关于获取组件中返回的二进制数据(SAFEARRAY)的问题(一定给分!)
- 关于加入自动加入收藏夹的问题?
- 如何在提交之前提示一个对话框,点击后提交,不点则不提交?
答:是指IE加载一个窗口后自动会加载一个方法。
{
...
loMain.addfolder = function(str,cont){..}是什么用法?
...}答:
首先看到这里
var loMain = document.createElement("<span style='overflow:hidden;height:"+aih+";width:"+aiw+"'></span>");
定义loMain
然后在 loMain中执行addfolder //增加一个目录
loMain.addfolder = function(str,cont){..}是什么用法?这个是函数的调用啊
function loMain.addfolder(str,cont)
{
// ...
}
定义一个loMain类的成员函数addfolder
function(str,cont)为参数申明
{..}为实现
谢谢
你观察的很仔细阿
哈哈。
我觉得这个比升级了还高兴啊!
{
...
loMain.addfolder = function(str,cont){..}是什么用法?
...
}指定loMain的addfolder成员(属性)为一个匿名函数,这样就可以为loMain添加一个addfolder方法。
与
function loMain.addfolder(str,cont)
{
// ...
}此二者的意义是完全不同的,第二个只是起了一个函数,名字叫loMain.addfolder。
示例程序:<script>
function a()
{
this.m = function(){alert();};
}function a.m1()
{
alert();
}new a().m();try
{
new a().m1();
}
catch (e)
{
alert(e.message);
}a.m1();
</script>
function a()
{
this.m = function(){alert();};
}var tmp = new a();tmp.m();function tmp.m1()
{
alert();
}
</script>