html摺疊選單mysql 摺疊選單及登陸鎖屏特效

2021-10-22 19:26:37 字數 2530 閱讀 7594

摺疊選單

//dtree 目錄樹結構

var d = new dtree("d");

d.add(0,-1,"根目錄");

d.add(1,0,"一級目錄1");

d.add(2,0,"一級目錄2");

d.add(3,0,"一級目錄3");

d.add(4,0,"一級目錄4");

d.add(5,2,"二級目錄2");

d.add(6,4,"二級目錄4");

d.add(7,4,"二級目錄4");

d.add(8,7,"**目錄4");

d.add(9,8,"demo站點 登陸鎖屏效果","demo.html");

document.write(d);

展開全部  ||  摺疊全部

登陸鎖屏效果

function salert(str){

//alert(str);

//建立遮罩層

var bgobj = document.createelement("div");

bgobj.id = "div1";

bgobj.style.position = "absolute";  //定位

bgobj.style.top = "0"; //距離頂部的距離

bgobj.style.left = "0"; //距離左邊的距離 ,與上面2行一起完成全屏遮罩

bgobj.style.border = "1px solid #f00"; //邊框

bgobj.style.background = "#44eeff"; //背景色

= "100%"; //寬度的另一種表示方式

bgobj.style.width = document.body.offsetwidth+"px";

= "100%"; //高度的另一種表示方式

bgobj.style.height = screen.height+"px";

//alert(bgobj.style.width);

//alert(bgobj.style.height);

bgobj.style.opacity = "0.1"; //ie9 firefox 下的透明度設定

bgobj.style.filter = "progid:dximagetransform.microsoft.alpha(style=3,opacity=25,finishopacity=75)";  // ie 低版本下的**

bgobj.style.zindex = 1000; // 層的堆疊順序,序號大的,就堆疊在上面

//建立彈窗框

var mobj = document.createelement("div");

//alert(mobj);

mobj.id = "div2";

//邊框 大小

mobj.style.border = "1px solid #ff0000";

mobj.style.width = "450px";

mobj.style.height = "250px";

mobj.style.background = "#efefef";

//定位

mobj.style.position = "absolute";

mobj.style.top = "35%";

mobj.style.left = "30%";

//堆疊順序

mobj.style.zindex = 1001;

//新增訊息層 -- 關閉按鈕執行動作層

var title = document.createelement("h3");

title.id = "title";

title.align = "right";

title.innerhtml = "關閉";

title.style.border = "1px solid #dfdffd";

title.style.background = "#c5c5c5";

title.style.margin = "0";  //定位距離訊息框頂部的距離

title.onclick = function(){

//alert(11212);

document.body.removechild(bgobj); //先刪除背景遮罩層物件

mobj.removechild(title); // 再刪除本訊息層物件

document.body.removechild(mobj); //最後刪除彈窗框物件

//最後子啊訊息層裡新增頁面內容

var pinfo = document.createelement("p");

pinfo.align = "center";

//新增內容

pinfo.innerhtml = "這裡是你的網頁**

";pinfo.innerhtml += "使用者名稱:

";pinfo.innerhtml += "密 碼:

";pinfo.innerhtml += "";

這裡是js 登陸效果的demo 頁面

返回首頁

Js摺疊選單

html指令碼 h1 摺疊選單 h1 div ahref menu1.html class menulink 足球隊 a ulid menu1 li 國安 li li ac公尺蘭 li li 皇家馬德里 li ul div div ahref menu2.html class menulink 籃球...

vue element ui製作折疊式選單

近期打算做乙個進銷存系統,因為好久沒做前端了,花了一天的時間複習了下vue,用element ui做了個折疊式選單。其中複習到的知識點有 transition動畫,vuex狀態管理,vue route路由。1.設定路由 import vue from vue import vuerouter fro...

專案中選單摺疊問題

思路 根據訪問的路徑動態的設定選單的摺疊。前提是同一級選單放大同一資料夾下面,根據資料夾的名字動態的設定選單的class屬性。例如 我的乙個url location.pathname獲取到除去ip與埠的位址 exam view outdepart outdepartempmanage.jsp fun...