0顶

功能强大的菜单生成器

稿源：互联网 2022-06-28 03:19:45 点击： 872 撤稿纠错

这个菜单生成器功能非常强大，想深入学习就来研究这个吧。

以下讨论的是和相关的功能强大的菜单生成器教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="keywords" content="站长,网页特效,js特效,广告代码,zzjs,zzjs.net,sky,www.zzjs.net,站长特效 网" />
<meta name="description" content="www.zzjs.net,站长特效网，站长必备js特效及广告代码。大量高质量js特效，提供高质量广告代码下载,尽在站长特效网" />
<title>功能强大的菜单生成器，sky整理收集。</title>
<script language="javascript">
//生成代码
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 +
		"<div id='mainboard' style='position:absolute; left:2px; top:2px; width:120px; height:" + totalheight + "px; z-index:1; overflow: hidden; background: #" + fcreate.bodycolor.value + ";'> ";
	itemtop = 0;
	for (i = 1; i <= parseInt(fcreate.itemcount.value); i++)
	{
		textCode.value += "<div id='item" + i + "body' style='position:absolute; left:0; top:" + itemtop + "; width:120px; height:" + fcreate.bodyheight.value + "px; z-index:" + (i+1) +"; overflow: hidden'>" +
		"<table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'>" +
		"<tr>" +
	"<td id='item" + i + "head' height='" + (fcreate.headheight.value-2) + "' class=";
if (i == 1)
	textCode.value += "'headtd2'";
else textCode.value += "'headtd1'";
textCode.value += " onclick='showme(item" + i + "body,this)' align='center'>";
//textCode.value += getValue("fcreate.item" + i);
textCode.value +=document.all["item"+i].value+"</td>"+
		"</tr>" +
		"<tr>" +
	"<td class='bodytd' align='center'>" +
	"test" +
	"</td>" +
		"</tr>" +
			"</table>" +
			"</div>";
		if (i == 1)
			itemtop += parseInt(fcreate.bodyheight.value);
		else itemtop += parseInt(fcreate.headheight.value);
	}
	textCode.value += "</div></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 = "<table width='700' border='0' align='center' cellpadding='1' cellspacing='1'>";
		for (i = 1; i <= fcreate.itemcount.value; i++)
		{
			itemtext += "<tr>"+
				"<td class='td2' width='76'>菜单项目"+i+"</td>" +
				"<td colspan='2' class='td2'>" +
			"	<input type='text' name='item" + i + "' class='back2' style='width:200' value='菜单" + i + "'>" +
				"</td>" +
				"<td class='td2' width='173'>菜 单 项 目 内  容  网  页</td>" +
				"<td colspan='2' class='td2'>" +
			"	<input type='file' name='itemsrc" + i + "' class='back2' style='width:200'>" +
				"</td>" +
				"</tr>";
		}
		itemtext+="</table>"
		document.all.itemmenu.innerHTML = itemtext;
	}
}
//检查是否是一个合法的颜色数值
function changebkclr(obj)
{//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
	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)
{//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
	if (isNaN(obj.value))
	{
		alert("请输入数字！");
		obj.focus();
		return;
	}
}
//检查改变数值的速度合法性
function changespd(obj)
{
	fcreate.mspeed.value = 1;
}
//检查是否是一个合法的速度
function checkspeed(obj)
{//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
	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;
}//欢迎来到站长特效网，我们的网址是www.zzjs.net，很好记，zz站长，js就是js特效，本站收集大量高质量js代码，还有许多广告代码下载。
</script>
<style type="text/css">

</style>
</head>
<body bgcolor='#FFFFFF' text='#000000'>
<a href="<#ZC_BLOG_HOST#>">站长特效网</a>,站长必备的高质量网页特效和广告代码。zzjs.net，站长js特效。<hr>

<div align="center">
  	<textarea name="textCode" rows="28" style="width:700" class="back2" readonly><</textarea>
  <input type="button" name="btnCreate" value="<- 生成代码 (ALT+M)" class="back2" style="width:150" onclick="createCode()" accessKey="m">
  <input type="button" name="btnClear" value="#= 清空代码 (ALT+C)" class="back2" style="width:150" onclick="clearCode()" accessKey="c">
  <input type="button" name="btnPrev" value="O- 预览效果 (ALT+P)" class="back2" style="width:150" onclick="prevCode()" accessKey="p">
  <input type="button" name="btnSelect" value="@@ 全选代码 (ALT+A)" class="back2" style="width:150" onclick="selectCode()" accessKey="a">
</div>
<form name="fcreate" method="post" action="">
  <table width="700" border="0" align="center" cellpadding="2" cellspacing="1">
    <tr>
      <td class="td1" width="13%" height="13">菜单项目个数</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="itemcount" style="width:40" class="back2" onblur="checkItems()" value="2">
      </td>
      <td class="td1" width="13%" height="13">菜单题头高度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="headheight" class="back2" value="22" style="width:50" onblur="checknum(this)" onchange="checkspeed(fcreate.mspeed)">
      </td>
      <td class="td1" width="13%" height="13">菜单体高度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="bodyheight" class="back2" value="202" style="width:50" onblur="checknum(this)" onchange="checkspeed(fcreate.mspeed)">
      </td>
      <td class="td1" width="13%" height="13">填写移动速度</td>
      <td class="td1" width="12%" height="13">
        <input type="text" name="mspeed" class="back2" value="10" style="width:50" onblur="checkspeed(this)">
      </td>
    </tr>
    <tr>
      <td class="td1" colspan="8" height="55">
        <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0" dwcopytype="CopyTableRow">
          <tr>
            <td class="td1" width="16%">
            <td class="td1" width="20%">一 般 题 头 颜 色</td>
              <input type="text" name="headcolorn" class="back1" style="background:#00A4E1" value="00A4E1" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td class="td1" width="16%">亮 边 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="lbordern" class="back1" style="background:#00BBFF" value="00BBFF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td class="td1" width="16%">暗 边 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="dbordern" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)" maxlength="6">
            </td>
          </tr>
          <tr>
            <td class="td1" width="20%">当 前 题 头 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="headcolora" class="back1" style="background:#20C1FF" value="20C1FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td width="16%"  class="td1">亮 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="lbordera" class="back1" style="background:#60D3FF" value="60D3FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td  class="td1" width="16%">暗 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="dbordera" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)" maxlength="6">
            </td>
          </tr>
          <tr>
            <td class="td1" width="20%">菜 单 主 体 颜 色</td>
            <td class="td1" width="16%">
              <input type="text" name="bodycolor" class="back1" style="background:#99CCFF" value="99CCFF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td width="16%"  class="td1">亮 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="lborderb" class="back1" style="background:#B0D8FF" value="B0D8FF" onblur="changebkclr(this)" maxlength="6">
            </td>
            <td  class="td1" width="16%">暗 边 颜 色</td>
            <td  class="td1" width="16%">
              <input type="text" name="dborderb" class="back1" style="background:#0077FF" value="0077FF" onblur="changebkclr(this)">
            </td>
          </tr>
        </table>
      </td>
    </tr>
    <tr>
      <td class="td1" width="80">菜单  总题目</td>
      <td class="td1" width="85">
        <select name="title" style="width:40" class="back2" onchange="ctrltitle(this)">
          <option value="有">有</option>
          <option value="无" selected>无</option>
        </select>
      </td>
      <td width="95"  class="td1">题目名称</td>
      <td colspan="5"  class="td1">
        <input type="text" name="titlename" class="back2" value="填写总题目" disabled>
      </td>
    </tr>
  </table>
	<div id="itemmenu">
      <table width='700' border='0' align='center' cellpadding='1' cellspacing='1'>
    	<tr>
    	  <td class='td2' width='76'>菜单项目1</td>
    	  <td colspan='2' class='td2'>
    		<input type='text' name='item1' class='back2' style='width:200' value="菜单1">
    	  </td>
    	  <td class='td2' width='173'>菜 单 项 目 内  容  网  页</td><td colspan='2' class='td2'>
    		<input type='file' name='itemsrc1' class='back2' style='width:200'>
    	  </td>
    	</tr>
    	<tr>
    	  <td class='td2' width='76'>菜单项目2</td>
    	  <td colspan='2' class='td2'>
    		<input type='text' name='item2' class='back2' style='width:200' value="菜单2">
    	  </td>
    	  <td class='td2' width='173'>菜 单 项 目 内  容  网  页</td><td colspan='2' class='td2'>
    		<input type='file' name='itemsrc2' class='back2' style='width:200'>
    	  </td>
    	</tr>
    </table>
    </div>
</form>
<div style="display:none">
<textarea name="text1" rows="5" style="width:700" class="back1" readonly>
<html>
<head>
<title>QQ菜单</title>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
<script language='JavaScript'>
</textarea>
<textarea name="text2" rows="5" style="width:700" class="back1" readonly>
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'>
</textarea>
<textarea name="text3" rows="5" style="width:700" class="back1" readonly>
</style>
</head>
<body bgcolor='#FFFFFF' text='#000000'>
</textarea>
</div>
</body>
</html>

关于功能强大的菜单生成器的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2016328562657.shtml方便下次再访问哦。

·上一篇： 导航菜单多层下拉子菜单
·下一篇： 当前网页中打开新窗口效果

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

功能强大的菜单生成器

文章分类LIST >>返回首页

最新游戏

最新新闻