javascript滑动菜单制作

zoukankan html css js c++ java

javascript滑动菜单制作

     下面是用javascript制作的滑动菜单效果，其实在显示的页面就是只用了一个Label控件，HTML代码都是自动生成的。

javascript的代码：

function showme(obj1, obj2)

{

    if (moving)

        return;

    moving = true;

    for(i=0;i<document.all.tags('td').length;i++)

        if (document.all.tags('td')[i].className.indexOf('headtd') == 0)

            document.all.tags('td')[i].className = 'headtd1';

    obj2.className = 'headtd2';

    moveme(obj1);

}

function moveme(obj)

{

    idnumber = parseInt(obj.id.substr(4));

    objtop = headHeight * (idnumber - 1);

    objbuttom = bodyHeight + headHeight * (idnumber - 2);

    currenttop = parseInt(obj.style.top);

    if (currenttop >= objbuttom)

    {

        countid = 1;

        for(i=0;i<document.all.tags('div').length;i++)

            if (document.all.tags('div')[i].id == 'item'+countid+'body')

            {

                obj = document.all.tags('div')[i];

                objtop = headHeight * (countid - 1);

                if (countid == idnumber)

                {

                    moveup(obj,objtop,false);

                    break;

                }

                else

                    moveup(obj,objtop,true);

                countid++;

            }

    }

    else if ((currenttop <= objtop) && (idnumber < objcount))

    {

        idnumber++;

        countid = objcount;

        for(i=document.all.tags('div').length-1;i>=0;i--)

            if (document.all.tags('div')[i].id == 'item'+countid+'body')

            {

                obj = document.all.tags('div')[i];

                objbuttom = bodyHeight + headHeight * (countid - 2);

                if (countid == idnumber)

                {

                    movedown(obj,objbuttom,false);

                    break;

                }

                else

                    movedown(obj,objbuttom,true);

                countid--;

            }

    }

}

function moveup(obj,objtop,ismove)

{

    currenttop = parseInt(obj.style.top);

    if (currenttop > objtop)

    {

        obj.style.top = currenttop - step;

        setTimeout('moveup('+obj.id+','+objtop+','+ismove+')',1)

        return;

    }

    moving = ismove;

}

function movedown(obj,objbuttom,ismove)

{

    currenttop = parseInt(obj.style.top);

    if (currenttop < objbuttom)

    {

        obj.style.top = currenttop + step;

        setTimeout('movedown('+obj.id+','+objbuttom+','+ismove+')',1)

        return;

    }

    moving = ismove;

}

组织菜单的代码：

   菜单

查看全文

相关阅读:
【转】依赖注入那些事儿
 【转】Visual Studio單元測試小應用-測執行時間
 【转】代码设计敏捷开发三部曲
 【转】 c#中两个DateTimePicker，一个时间设置为0:0:0,另一个设置为23:59:59
【转】 C#获取当前程序运行路径的方法集合
 CSVHelper读出乱码解决方案
 CvsHelper 使用指南
 【转】 C# ListView实例：文件图标显示
 【转】C# winform 加载网页模拟键盘输入自动接入访问网络
 基于MHA的MySQL高可用

原文地址：https://www.cnblogs.com/ringwang/p/992094.html