60度 Eadren 网络 >> 设计教程 >> 网页制作 >> Html·Css·特效 >> 特效 >> 代码生成类 >> 正文[打印] [收藏]

类似QQ菜单的代码生成器，如果你想做个QQ菜单的话，用它最简

作者：生鱼片文章来源：互联网点击数：更新时间：2006-4-10 22:33:27

演示区

CreateCode

菜单项目个数菜单题头高度菜单体高度填写移动速度一般题头颜色亮边颜色暗边颜色当前题头颜色亮边颜色暗边颜色菜单主体颜色亮边颜色暗边颜色菜单总题目题目名称菜单项目1 菜单项目内容网页菜单项目2 菜单项目内容网页


<html>

<head>

<title>QQ菜单</title>

<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>

<script language='JavaScript'>


var moving = false;

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;

}

</script>

</script>

<style type='text/css'>




</style>

</head>

<body bgcolor='#FFFFFF' text='#000000'>

脚本说明：

将下面的代码加在<head></head>之间

将下面的代码加在<body></body>之间

<html>

<head>

<title>CreateCode</title>

//生成代码

function createCode()

{

totalheight = parseInt(fcreate.bodyheight.value) + fcreate.headheight.value * (fcreate.itemcount.value - 1);

textCode.value = text1.value +

"var headHeight = " + fcreate.headheight.value + ";" +

"var bodyHeight = " + fcreate.bodyheight.value + ";" +

"var objcount = " + fcreate.itemcount.value + ";" +

"var step = " + fcreate.mspeed.value + ";" +

text2.value +

".headtd1 {  background: #" + fcreate.headcolorn.value + "; border: 2px outset; border-color: #" + fcreate.lbordern.value + " #" + fcreate.dbordern.value + " #" + fcreate.dbordern.value + " #" + fcreate.lbordern.value + "; cursor: hand; font-size: 9pt}" +

".headtd2 {  background: #" + fcreate.headcolora.value + "; border: 2px outset; border-color: #" + fcreate.lbordera.value + " #" + fcreate.dbordera.value + " #" + fcreate.dbordera.value + " #" + fcreate.lbordera.value + "; cursor: hand; font-size: 9pt}" +

".bodytd  {  background: #" + fcreate.bodycolor.value + "; border: 2px outset; border-color: #" + fcreate.lborderb.value + " #" + fcreate.dborderb.value + " #" + fcreate.dborderb.value + " #" + fcreate.lborderb.value + "; font-size: 9pt}" +

text3.value +

" ";

itemtop = 0;

for (i = 1; i <= parseInt(fcreate.itemcount.value); i++)

{

textCode.value += "" +

"" +

"";

//textCode.value += getValue("fcreate.item" + i);

textCode.value +=document.all["item"+i].value+""+

"" +

"test" +

"" +

"";

if (i == 1)

itemtop += parseInt(fcreate.bodyheight.value);

else itemtop += parseInt(fcreate.headheight.value);

}

textCode.value += "</body></html>"

}

//获取对象的值

function getValue(obj)

{

//obj = Object(obj);

return obj.value;

}

//清空代码

function clearCode()

{

textCode.value = "";

}

//预览代码

function prevCode()

{

createCode();

open().document.write(textCode.value);

}

//选择代码

function selectCode()

{

textCode.select();

}

//根据输入的数字，自动生成子菜单的填写项

function checkItems()

{

if ((fcreate.itemcount.value.length > 0 && isNaN(fcreate.itemcount.value)) || fcreate.itemcount.value.length == 0)

{

alert("请输入数字！");

fcreate.itemcount.focus();

}

else

{

if (fcreate.itemcount.value > 50)

{

alert("太夸张了吧，小一点呀，不用这么玩命吧！（50以下，含50）")

fcreate.itemcount.focus();

return;

}

if (fcreate.itemcount.value < 1)

{

alert("太夸张了吧，一个不要你要做什么！（1以上，含1）")

fcreate.itemcount.focus();

return;

}

itemtext = "";

for (i = 1; i <= fcreate.itemcount.value; i++)

{

itemtext += ""+

"菜单项目"+i+"" +

"" +

"	<input type='text' name='item" + i + "' class='back2' style='width:200' value='菜单" + i + "'>" +

"" +

"菜 单 项 目 内  容  网  页" +

"" +

"	<input type='file' name='itemsrc" + i + "' class='back2' style='width:200'>" +

"" +

"";

}

itemtext+=""

document.all.itemmenu.innerHTML = itemtext;

}

//检查是否是一个合法的颜色数值

function changebkclr(obj)

{

hexv = new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");

flag = false;

if (obj.value.length != 6)

{

alert("请用正确填写！（六位数）");

obj.focus();

}

else

{

for (i = 0; i < 6; i++)

{

for (j = 0; j <16; j++)

if (obj.value.charAt(i).toLowerCase() == hexv[j])

flag = true;

if (!flag)

{

alert("请用十六进制填写。（0-9，a-f）");

obj.focus();

return;

}

flag = false;

}

obj.style.background=obj.value;

}

//检查是否是一个合法的数字

function checknum(obj)

{

if (isNaN(obj.value))

{

alert("请输入数字！");

obj.focus();

return;

}

//检查改变数值的速度合法性

function changespd(obj)

{

fcreate.mspeed.value = 1;

}

//检查是否是一个合法的速度

function checkspeed(obj)

{

if (isNaN(obj.value))

{

alert("请输入数字！");

obj.focus();

}

else

{

if ((obj.form.bodyheight.value - obj.form.headheight.value)%obj.value != 0)

{

alert("请确认可以被 “菜单体高度 - 菜单题头高度” 整除");

obj.focus();

}

//控制总题目的填写

function ctrltitle(obj)

{

if (obj.value == "有")

obj.form.titlename.disabled = false;

else

obj.form.titlename.disabled = true;

}

</script>

<!--

.td1{  font-size: 9pt; background: #66CCFF}

.td2{  font-size: 9pt; background: #66aaFF}

.back1 {  font-size: 9pt; width:100}

.back2 {  font-size: 9pt; background: #BECFEE}

-->

</style>

</head>


<html>

<head>

<title>QQ菜单</title>

<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>

<script language='JavaScript'>


var moving = false;

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;

}

</script>

</script>

<style type='text/css'>




</style>

</head>

<body bgcolor='#FFFFFF' text='#000000'>

将下面的代码加在<body>里(例<body **加代码处**>)

上一篇教程：你想使一段字符变色吗？用这个吧，可以选择按字符变还是按单词变

下一篇教程：自动生成问题回答页面，使用简单方便，不可错过

相关类似QQ菜单的代码生成器，如果你想做个QQ菜单的话，用它最简的文章：

60度 Eadren 网络 >> 设计教程 >> 网页制作 >> Html·Css·特效 >> 特效 >> 代码生成类 >> 正文[打印] [收藏]

类似QQ菜单的代码生成器，如果你想做个QQ菜单的话，用它最简

网友评论

全站阅读排行

本类热门教程