读书人

这个菜单是如何实现的

发布时间: 2012-01-13 22:43:29 作者: rapoo

这个菜单是怎么实现的
http://www.flyinweb.com/dzh/dzh.htm
左边的菜单可以折叠,是怎么实现的,是AJAX的工具吗,是什么工具,还可以拖大拖小

[解决办法]
框架吧
[解决办法]
csdn的也可以来回拽, 可大可小的。就是简单地框架。
[解决办法]
来回拽的是框架-- 折叠应该是js+css(个人意见)
[解决办法]
首先做了一个框架,在左边动态生成列表框内容(嵌入式超连接),再触发.
[解决办法]
框架页嘛

拖动的默认就可以

点击折叠是js控制
[解决办法]
js + css
[解决办法]
我看也是框架。。然后折叠的话,用treeview控件就OK了啊
[解决办法]
你保存下网页,在文件夹里的dzh.js文件就有实现的代码
[解决办法]
使用表格套框架,现在表格画好,里边套上框架,点击的时候,就隐藏其中的一边,回头给你找个例子
[解决办法]
他的js全部代码
JavaScript Document
function $(d){return document.getElementById(d);}

function GetOffset(e)
{
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent)
{
t +=e.offsetTop;
l +=e.offsetLeft;
}
return [t,l];
}

function go()
{
if ($('leftTD').style.display == "")
{
$('leftTD').style.display = "none";
$('cheat').childNodes[0].style.backgroundPosition = 'left';
}
else
{
$('leftTD').style.display = "";
$('cheat').childNodes[0].style.backgroundPosition = 'right';
}
}

function trygo()
{
if ($('leftTD').style.display == "none") go();
}

function tryclose()
{
if ($('leftTD').style.display == "") go();
}

if (document.getElementById){
(
function(){

var n = 500;
var dragok = false;
var y,x,d,dy,dx;

function move(e)
{
if (!e) e = window.event;
if (dragok){

var mainstyle=$('main').style;
try{
var left = dx + e.clientX - x;

if (left<160||left>750){
mainstyle.border='1px dashed #D0D8D9';
return;
}
else
{
mainstyle.border='';
}

mainstyle.left=left;
mainstyle.position="absolute";
$('cheat').style.display='none';
return false;
}
catch(e){}
}
}

var shadowTimer;

function down(e){
if (!e) e = window.event;

var temp = (typeof e.target != "undefined")?e.target:e.srcElement;
if (temp.tagName != "HTML"|"BODY" && temp.className != "dragclass"){
temp = (typeof temp.parentNode != "undefined")?temp.parentNode:temp.parentElement;
}
if('TR'==temp.tagName){
temp = (typeof temp.parentNode != "undefined")?temp.parentNode:temp.parentElement;
temp = (typeof temp.parentNode != "undefined")?temp.parentNode:temp.parentElement;
temp = (typeof temp.parentNode != "undefined")?temp.parentNode:temp.parentElement;
}

if (temp.className == "dragclass"){
dragok = true;
temp.style.zIndex = n;


d = temp;
dx = GetOffset(temp)[1];
dy = GetOffset(temp)[0];
x = e.clientX;

document.onmousemove = move;
shadowTimer=window.setTimeout(function(){$('shadow').style.zIndex=100},150);
return false;
}
}

function up(){

if (dragok == true)
{
window.clearTimeout(shadowTimer);

$('shadow').style.zIndex=-10;
$('cheat').style.display='';
$('main').style.height="100%";
$('main').style.border='';
$('main').style.position="static";
if ($('leftTD').style.display == "none")
{
$('leftTD').style.display = "";
$('cheat').childNodes[0].style.backgroundPositionX = 'right';
}
}
try{
var _$w = parseInt($('main').style.left) + "px";
$('leftTD').style.width = _$w;
$('subjects').style.width = _$w;
}catch(e){}
dragok = false;

document.onmousemove = null;
}

document.onmousedown = down;
document.onmouseup = up;

}
)();
}


function Init()
{
BodyAutoFitHeight();
window.onresize = BodyAutoFitHeight;
window.setTimeout(BodyAutoFitHeight,3000);

if($('navDirection'))
{
$('navDirection').onclick=function()
{
var cel=$('mainTable').rows[0].cells;
cel[0].swapNode(cel[2]);
this.innerText=(this.innerText.indexOf('右')>0?'导航在左':'导航在右');
}
}
}

function BodyAutoFitHeight()
{
$('subjects').style.height = document.body.clientHeight-120;//205;
$('mainTable').style.height = document.body.clientHeight-60;
}
[解决办法]
就是框架了

读书人网 >asp.net

热点推荐