请教高手一种特效的实现代码

[moplusplus]

我希望在网页中实现弹出菜单,是滑动出的那种,就是有一个字段或者按钮,当我的鼠标移动到那个字段或者按钮上时,横向滑动出菜单.请问高手如何实现?

[文盲老顾]

<div style="position:relative;width:40;height:40;background:#FFCCDD;border:1px solid black;" id=tst onmouseover=showMenu('Sub_tst'); onmouseout=hideMenu('Sub_tst');>
	<div style="position:absolute;left:99%;height:40;width:0px;border:1px solid black;background:#FFFFDD;overflow:hidden;" id=Sub_tst>
		<div style="width:300px;">this is a menu line</div>
	</div>
</div>

<script>
var ts;
function showMenu(id){
	var obj = document.getElementById(id);
	var width = obj.style.width.replace('px','') * 1;
	var mn = (obj.childNodes[0].nodeName!='DIV')?(obj.childNodes[1]):(obj.childNodes[0]);
	if (width < mn.offsetWidth * 1){
		clearTimeout(ts);
		obj.style.width = (width + 2) + 'px';
		ts = setTimeout("showMenu('" + id + "');",10);
	}else{
		obj.style.width = mn.offsetWidth + 'px';
	}
}

function hideMenu(id){
	var obj = document.getElementById(id);
	var width = obj.style.width.replace('px','') * 1;
	if (width > 0){
		clearTimeout(ts);
		obj.style.width = (width - 2) + 'px';
		ts = setTimeout("hideMenu('" + id + "');",10);
	}else{
		obj.style.width = '0px';
	}
}
</script>

[moplusplus]

请高手帮忙啊

[silence2k]

可以提供代码 不过人家是 混淆过的 要的话得自己分析
这个是纵向滚动的
http://www.wood-son.com/temp/code/slide.html

[silence2k]

鼠标放 问号上就有效果

[snlixing]

http://www.7stk.com/caidan/cd03.htm

[lxtrayn]

DIV隐藏和展示，要平滑的话得加个延时程序。

[文盲老顾]

[Quote=引用 5 楼 lxtrayn 的回复:]
DIV隐藏和展示，要平滑的话得加个延时程序。
[/Quote]

定义 left 与 scrollLeft 的差值

[moplusplus]

楼上高手能否说的详细一些，由于刚入门，理解起来有些困难。呵呵

[Anlige]

js就可以实现啊~

[文盲老顾]

<div id=online_help style="width:150;position:absolute;top:70;left:0;cursor:text;z-index:99" onmouseover="javascript:perf=4;" onmouseout="javascript:perf=-4;">
</div>

<script>
var perf=0;
var onlineleft=0;

function move_online1(){
	onlineleft+=perf;
	if ((onlineleft>99)||(onlineleft<1)){
		perf=0;
		if(onlineleft>99){
			onlineleft=100;
		}else{
			onlineleft=0;
		}
	}
	loc_top=document.body.scrollTop+70;
	now_top=online_help.style.pixelTop;
	online_help.style.left=document.body.scrollLeft-100+onlineleft;
	if (loc_top!=now_top){
		online_help.style.top=now_top+Math.round((loc_top-now_top)/20)+Math.abs(loc_top-now_top)/(loc_top-now_top);
	}
	setTimeout("move_online1()",20);
}

move_online1();
</script>

[fishidea]

楼上正解,好代码,比我用的好像还简洁,收下了^_^

[moplusplus]

回复superwfei:
这段代码如何与具体的菜单控件绑定呢？

[moplusplus]

就是如何加载到页面当中，我运行时，系统报错：缺少对象

[ab520ah]

http://qzshi.com

[正宗老冉]

楼上正解，效果很不错。
把你的菜单扔到那个层里就可以了。

[moplusplus]

按照那位高手的做法做了,就是我的隐藏的层打开的过程中,我的鼠标不停的在闪,而且鼠标经常出现沙漏.不知是为什么

[nongdun]

谢谢各位高手。留下代码备用~~

[xtdenglei]

你装　一个dreamwearver cs3看看，里面自带很多特效功能功能。

[moplusplus]

我再把我的问题描述的具体一点：
我从photoshop中切割出了一个网页的各个部分，其中一个部分我放入了代码：
<div style="position:relative;width:40;height:40;background:#FFCCDD;border:1px solid black;" id=tst onmouseover=showMenu('Sub_tst'); onmouseout=hideMenu('Sub_tst');>
<div style="position:absolute;left:99%;height:40;width:0px;border:1px solid black;background:#FFFFDD;overflow:hidden;" id=Sub_tst>
<div style="width:300px;">this is a menu line </div>
</div>
</div>

<script>
var ts;
function showMenu(id){
var obj = document.getElementById(id);
var width = obj.style.width.replace('px','') * 1;
var mn = (obj.childNodes[0].nodeName!='DIV')?(obj.childNodes[1]):(obj.childNodes[0]);
if (width < mn.offsetWidth * 1){
clearTimeout(ts);
obj.style.width = (width + 2) + 'px';
ts = setTimeout("showMenu('" + id + "');",10);
}else{
obj.style.width = mn.offsetWidth + 'px';
}
}

function hideMenu(id){
var obj = document.getElementById(id);
var width = obj.style.width.replace('px','') * 1;
if (width > 0){
clearTimeout(ts);
obj.style.width = (width - 2) + 'px';
ts = setTimeout("hideMenu('" + id + "');",10);
}else{
obj.style.width = '0px';
}
}
</script>

我运行时，当隐藏层出现时，屏幕似乎在不停的刷新一样，就是鼠标不停的闪，而且旁边有沙漏，请问高手这是怎么回事？

[文盲老顾]

机器速度问题，关几个软件再看