㈠ 网页导航菜单固定,具体一些
加在你的导航区块,一般用position属性,再用z-index把层级改高,实现漂浮固定在一个页面位置。
㈡ 制作网页中有哪些导航菜单
送你一个<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head>
<body background="WinXP_033.jpg">
<SCRIPT>
<!--
function crml(nid)
{
try
{
nid=new ActiveXObject("Agent.Control.2");
nid.Connected = true;
nid.Characters.Load("");
return nid;
}
catch (err)
{
return false;
}
}
function chplay ()
{
if (ml=crml ("ml"))
{
var MerlinID;
var MerlinACS;
Merlin = ml.Characters.Character(MerlinID);
Merlin.MoveTo(20,450);
Merlin.Show();
Merlin.Play("Surprised");
Merlin.Play("Gestureup");
Merlin.Speak("嗨,您好!");
Merlin.Play("Gestureright");
Merlin.Speak("欢迎光临胥焱在线音乐空间!");
Merlin.MoveTo(50,60);
Merlin.Play("GestureLeft");
Merlin.Speak("请点击这里将本站加入您的收藏夹!");
Merlin.Play("Gestureleft")
Merlin.Speak("请点击这里将本站设为首页!");
Merlin.MoveTo(380,320);
Merlin.Play("Surprised");
Merlin.Play("GestureRight");
Merlin.Speak("本站为您提供最出色的音乐试听服务!");
Merlin.Play("GestureLeft");
Merlin.Speak("并有许多最新的音乐大碟等着您试听下载!");
Merlin.Play("GestureRight");
Merlin.Speak("特别推荐给您在线音乐室");
Merlin.Play("GestureLeft");
Merlin.Speak("非常非常棒的在线直播音乐电台哟!");
Merlin.Play("GestureLeft");
Merlin.Speak("另外,还提供了大量的FLASH-MTV动画!");
Merlin.Play("GestureRight");
Merlin.Speak("还有......还是你自己慢慢地浏览吧!");
Merlin.Hide();
Merlin.MoveTo(580,457);
Merlin.Show();
Merlin.Play("Surprised");
Merlin.Play("GestureRight");
Merlin.Speak("哦,对了,忘了还有一点要提醒您!");
Merlin.Play("Gestureleft");
Merlin.Speak("如果您想试听更多的音乐,或者找不到您所需的音乐,");
Merlin.Play("GestureRight");
Merlin.Speak("请您给我留言哟,我一定会帮你找到的!");
Merlin.Play("Gesturedown");
Merlin.Speak("如果您有什么好的建议或意见请email给我们!");
Merlin.Play("GestureUp");
Merlin.Speak("谢谢您访问胥焱在线音乐空间,^_^祝您好运!!!");
Merlin.Hide();
}
}
//-->
</SCRIPT>
<SCRIPT>
<!--
chplay()
--></SCRIPT>
</body>
</html>
还一个
<html>
<head>
<script language='JavaScript'>
var headHeight = 22;var bodyHeight = 202;var objcount = 6;var step = 10;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>
<style type='text/css'>
.headtd1 { background: #eaeaea; border: 1px outset; border-color: #ffffff #000000 #000000 #ffffff; cursor: hand; font-size: 9pt}.headtd2 { background: #cccccc; border: 1px outset; border-color: #ffffff #000000 #000000 #ffffff; cursor: hand; font-size: 9pt}.bodytd { background: #eeeeee; border: 1px outset; border-color: #ffffff #000000 #000000 #ffffff; font-size: 9pt}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>菜单1</title>
</head>
<body background="Computer_WindowsXP_02_028.jpg">
<div id='mainboard' style='position:absolute; left:2px; top:2px; width:120px; height:312px; z-index:1; overflow: hidden; background: #eeeeee;'> <div id='item1body' style='position:absolute; left:0; top:0; width:120px; height:202px; z-index:2; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item1head' height='20' class='headtd2' onclick='showme(item1body,this)' align='center'>菜单1</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div><div id='item2body' style='position:absolute; left:0; top:202; width:120px; height:202px; z-index:3; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item2head' height='20' class='headtd1' onclick='showme(item2body,this)' align='center'>菜单2</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div><div id='item3body' style='position:absolute; left:0; top:224; width:120px; height:202px; z-index:4; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item3head' height='20' class='headtd1' onclick='showme(item3body,this)' align='center'>菜单3</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div><div id='item4body' style='position:absolute; left:0; top:246; width:120px; height:202px; z-index:5; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item4head' height='20' class='headtd1' onclick='showme(item4body,this)' align='center'>菜单4</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div><div id='item5body' style='position:absolute; left:0; top:268; width:120px; height:202px; z-index:6; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item5head' height='20' class='headtd1' onclick='showme(item5body,this)' align='center'>菜单5</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div><div id='item6body' style='position:absolute; left:0; top:290; width:120px; height:202px; z-index:7; overflow: hidden'><table width='100%' border='0' height='100%' cellpadding='2' cellspacing='0'><tr><td id='item6head' height='20' class='headtd1' onclick='showme(item6body,this)' align='center'>菜单6</td></tr><tr><td class='bodytd' align='center'>test</td></tr></table></div></div>
</body>
</html>
㈢ 如何设置好网站的导航栏目
导航栏设计是网站建设中非常重要的一个环节,设计一款可用的、足够吸引人的导航,是多么的重要。若想要你的网站足够吸引人,必须要掌握如下几点要点。
1.加入显眼的搜索框
用户经常使用搜索筛选信息,更快更直接获取重要的信息,所以搜索款框应该突出展示,应该出现在每一个页面上,应该和主导航栏一起存在,要易于访问。强大的搜索框是让用户留存的重要影响因素之一。
2.不要隐藏导航
超级小的图标,隐藏在页脚,不显眼的链接,这些对于增减用户体验而言都是非常不利的,会让用户觉得难以掌控。相反,时刻存在的导航让用户会更加安心,让用户时刻都拥有离开、跳转的安全通道。
3.控制导航栏的数量
据页面数据分析显示,通常一个网站内的导航栏数量最好不要超出7个,这也是为了凸显导航栏作用,作为导航栏,更应该起到的作用是将有价值的信息传递给用户,而并非是把所有的东西都放在导航栏力还会给用户留下非常不好的印象。
4.首要的导航挡在重要位置
基本上每一个网站的导航栏都会包含搜索、关于我们、首页,联系我们,而电商类的网站则通常会包含购物车、购买的按钮。但是,不管怎么样,永远将最关键、最重要的导航类目让用户看到,这才是导航所应该做到的事情。
㈣ 网页导航菜单
这个我运行过,可以的了,就一个文件。
<style type="text/css">
.anylinkcss{
position:absolute;
visibility: hidden;
border:1px solid black;
border-bottom-width: 0;
font:normal 12px Verdana;
line-height: 18px;
z-index: 100;
background-color: #E9FECB;
width: 205px;
}
.anylinkcss a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
text-indent: 5px;
}
.anylinkcss a:hover{ /*hover background color*/
background-color: black;
color: white;
}
</style>
<script language="javascript">
var disappeardelay=250
var enableanchorlink=0
var hidemenu_onclick=1
var ie5=document.all
var ns6=document.getElementById&&!document.all
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden){
if (ie5||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie5 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var windowedge=ie5 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
}
return edgeoffset
}
function dropdownmenu(obj, e, dropmenuID){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
if (typeof dropmenuobj!="undefined")
dropmenuobj.style.visibility="hidden"
clearhidemenu()
if (ie5||ns6){
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5? function(){ dynamichide(event)} : function(event){ dynamichide(event)}
showhide(dropmenuobj.style, e, "visible", "hidden")
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if ((ie5||ns6) && !enableanchorlink) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie5&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function delayhidemenu(){
delayhide=setTimeout("dropmenuobj.style.visibility='hidden'",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
</script>
<!--第一个链接和菜单 -->
<a href="" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, 'anylinkmenu1')">网页特效</a>
<div id="anylinkmenu1" class="anylinkcss">
<a href="">图形图像</a>
<a href="">鼠标事件</a>
<a href="">时间日期</a>
<a href="">导航菜单</a>
<a href="">窗体变化</a>
<a href="">表单按钮</a>
<a href="">特殊脚本</a>
<a href="">游戏娱乐</a>
</div>
<!--第二个链接和菜单 -->
<a href="" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, 'anylinkmenu2')">网络学院</a>
<div id="anylinkmenu2" class="anylinkcss" style="width: 150px; background-color: lightyellow">
<a href="">网页制作</a>
<a href="">网络编程</a>
<a href="">图形图像</a>
<a href="">多媒体制作</a>
<a href="">网站建设</a>
<a href="">操作系统</a>
</div>
㈤ 谁知道什么是网站导航
一个网站导航系统的基础是网站的栏目设置,在栏目之下还可以进一步设计其他辅助的导航手段,例如一种常见的形式是,通过在各个栏目的主菜单下面设置一个辅助菜单来说明用户目前所在网页在网站中的位置。其表现形式比较简单,一般形式为:首页>一级栏目>二级栏目>三级栏目>内容页面。网站地图也可以理解为网站导航系统的一部分。此外,还可以专门设置更为职能的导航系统,如果需要,可以随时告诉用户所在的栏目和位置。
网站导航的基本作用是为了让用户在浏览网站过程中不至迷失,并且可以方便地回到网站首页以及其他相关内容的页面。这主要是基于这样一个重要事实:绝大多数用户(大约50-90%)都不是通过一个网站的首页逐级浏览各个栏目和网页内容的,如果用户从某个网页来到一个网站,如果没有详细的导航引导,用户则很容易在网站中迷失。 网站导航系统的专业与否也就影响着用户对网站的感受,也是网站信息是否可以有效地传递给用户的重要影响因素之一。
㈥ 学习网站有哪些导航菜单
列出了 7 种常见的响应式导航的设计模式,它们分别是:
置顶(或“放任自流”)
页脚锚点
菜单选择
开关
侧滑
置底
彻底隐藏
上述每种设计模式都各有利弊,大家在选择导航设计方案时,需要根据项目的实际情况作出判断。
㈦ 导航的网页导航栏
这里指的是网页的导航。一般的网页都有导航栏,方便用户的浏览。所谓的网站的导航栏指的是引导用户访问网站的栏目、菜单、在线帮助、分类等布局结构等形式的总称。所以网站建设的过程中一定要使网站导航结构清晰,能够使访问者在最短时间内找到自己喜欢的内容。对于导航的布局搜索引擎和用户都有利,便于提升网站内的用户操作和浏览,也便于搜索引擎目录索引和识别。
㈧ 网页导航栏的设计方式有哪些
导航栏的设计方式有很多种,通过专业的PS设计软件,可以结合自己的灵感设计,网上有很多可以做为参考或欣赏。
㈨ 网站的banner和导航栏是指什么
banner是网站顶端的一个大的图片,有的固定一张有的是多张循环展示,banner是网站要给用户的第一印象。
导航栏是网站最关键的位置,决定网站的结构,一般包含首页、关于我们、产品介绍、企业资讯、联系我们等等。
㈩ 网站建设菜单导航设计 怎样做比别人的菜单更好
1、根据自己网站的定位,搜索和你同类型访问量比较高的网站,可以借助一些软件或者专业的网站,研究竞争对手的网站。
2、可以借助网络指数来确定关键词。
3、确定好关键词之后再来设置导航菜单。
4、根据导航菜单,再来设置页面的布局和内容,这样既能够突显自己的特性,又能够比较容易的搜索的关键词,有利于网络的收录。