switch(event.keyCode) {
// ...
// 不同的按键可以做不同的事情
// 不同的浏览器的keycode不同
// 更多详细信息: http://unixpapa.com/js/key.html
// ...
}
})
keycode 0 =
keycode 1 =
keycode 2 =
keycode 3 =
keycode 4 =
keycode 5 =
keycode 6 =
keycode 7 =
keycode 8 = BackSpace BackSpace
keycode 9 = Tab Tab
keycode 10 =
keycode 11 =
keycode 12 = Clear
keycode 13 = Enter
keycode 14 =
keycode 15 =
keycode 16 = Shift_L
keycode 17 = Control_L
keycode 18 = Alt_L
keycode 19 = Pause
keycode 20 = Caps_Lock
keycode 21 =
keycode 22 =
keycode 23 =
keycode 24 =
keycode 25 =
keycode 26 =
keycode 27 = Escape Escape
keycode 28 =
keycode 29 =
keycode 30 =
keycode 31 =
keycode 32 = space space
keycode 33 = Prior
keycode 34 = Next
keycode 35 = End
keycode 36 = Home
keycode 37 = Left
keycode 38 = Up
keycode 39 = Right
keycode 40 = Down
keycode 41 = Select
keycode 42 = Print
keycode 43 = Execute
keycode 44 =
keycode 45 = Insert
keycode 46 = Delete
keycode 47 = Help
keycode 48 = 0 equal braceright
keycode 49 = 1 exclam onesuperior
keycode 50 = 2 quotedbl twosuperior
keycode 51 = 3 section threesuperior
keycode 52 = 4 dollar
keycode 53 = 5 percent
keycode 54 = 6 ampersand
keycode 55 = 7 slash braceleft
keycode 56 = 8 parenleft bracketleft
keycode 57 = 9 parenright bracketright
keycode 58 =
keycode 59 =
keycode 60 =
keycode 61 =
keycode 62 =
keycode 63 =
keycode 64 =
keycode 65 = a A
keycode 66 = b B
keycode 67 = c C
keycode 68 = d D
keycode 69 = e E EuroSign
keycode 70 = f F
keycode 71 = g G
keycode 72 = h H
keycode 73 = i I
keycode 74 = j J
keycode 75 = k K
keycode 76 = l L
keycode 77 = m M mu
keycode 78 = n N
keycode 79 = o O
keycode 80 = p P
keycode 81 = q Q at
keycode 82 = r R
keycode 83 = s S
keycode 84 = t T
keycode 85 = u U
keycode 86 = v V
keycode 87 = w W
keycode 88 = x X
keycode 89 = y Y
keycode 90 = z Z
keycode 91 =
keycode 92 =
keycode 93 =
keycode 94 =
keycode 95 =
keycode 96 = KP_0 KP_0
keycode 97 = KP_1 KP_1
keycode 98 = KP_2 KP_2
keycode 99 = KP_3 KP_3
keycode 100 = KP_4 KP_4
keycode 101 = KP_5 KP_5
keycode 102 = KP_6 KP_6
keycode 103 = KP_7 KP_7
keycode 104 = KP_8 KP_8
keycode 105 = KP_9 KP_9
keycode 106 = KP_Multiply KP_Multiply
keycode 107 = KP_Add KP_Add
keycode 108 = KP_Separator KP_Separator
keycode 109 = KP_Subtract KP_Subtract
keycode 110 = KP_Decimal KP_Decimal
keycode 111 = KP_Divide KP_Divide
keycode 112 = F1
keycode 113 = F2
keycode 114 = F3
keycode 115 = F4
keycode 116 = F5
keycode 117 = F6
keycode 118 = F7
keycode 119 = F8
keycode 120 = F9
keycode 121 = F10
keycode 122 = F11
keycode 123 = F12
keycode 124 = F13
keycode 125 = F14
keycode 126 = F15
keycode 127 = F16
keycode 128 = F17
keycode 129 = F18
keycode 130 = F19
keycode 131 = F20
keycode 132 = F21
keycode 133 = F22
keycode 134 = F23
keycode 135 = F24
keycode 136 = Num_Lock
keycode 137 = Scroll_Lock
keycode 138 =
keycode 139 =
keycode 140 =
keycode 141 =
keycode 142 =
keycode 143 =
keycode 144 =
keycode 145 =
keycode 146 =
keycode 147 =
keycode 148 =
keycode 149 =
keycode 150 =
keycode 151 =
keycode 152 =
keycode 153 =
keycode 154 =
keycode 155 =
keycode 156 =
keycode 157 =
keycode 158 =
keycode 159 =
keycode 160 =
keycode 161 =
keycode 162 =
keycode 163 =
keycode 164 =
keycode 165 =
keycode 166 =
keycode 167 =
keycode 168 =
keycode 169 =
keycode 170 =
keycode 171 =
keycode 172 =
keycode 173 =
keycode 174 =
keycode 175 =
keycode 176 =
keycode 177 =
keycode 178 =
keycode 179 =
keycode 180 =
keycode 181 =
keycode 182 =
keycode 183 =
keycode 184 =
keycode 185 =
keycode 186 =
keycode 187 = acute grave
keycode 188 = comma semicolon
keycode 189 = minus underscore
keycode 190 = period colon
keycode 191 =
keycode 192 = numbersign apostrophe
keycode 193 =
keycode 194 =
keycode 195 =
keycode 196 =
keycode 197 =
keycode 198 =
keycode 199 =
keycode 200 =
keycode 201 =
keycode 202 =
keycode 203 =
keycode 204 =
keycode 205 =
keycode 206 =
keycode 207 =
keycode 208 =
keycode 209 =
keycode 210 = plusminus hyphen macron
keycode 211 =
keycode 212 = copyright registered
keycode 213 = guillemotleft guillemotright
keycode 214 = masculine ordfeminine
keycode 215 = ae AE
keycode 216 = cent yen
keycode 217 = questiondown exclamdown
keycode 218 = onequarter onehalf threequarters
keycode 219 =
keycode 220 = less greater bar
keycode 221 = plus asterisk asciitilde
keycode 222 =
keycode 223 =
keycode 224 =
keycode 225 =
keycode 226 =
keycode 227 = multiply division
keycode 228 = acircumflex Acircumflex
keycode 229 = ecircumflex Ecircumflex
keycode 230 = icircumflex Icircumflex
keycode 231 = ocircumflex Ocircumflex
keycode 232 = ucircumflex Ucircumflex
keycode 233 = ntilde Ntilde
keycode 234 = yacute Yacute
keycode 235 = oslash Ooblique
keycode 236 = aring Aring
keycode 237 = ccedilla Ccedilla
keycode 238 = thorn THORN
keycode 239 = eth ETH
keycode 240 = diaeresis cedilla currency
keycode 241 = agrave Agrave atilde Atilde
keycode 242 = egrave Egrave
keycode 243 = igrave Igrave
keycode 244 = ograve Ograve otilde Otilde
keycode 245 = ugrave Ugrave
keycode 246 = adiaeresis Adiaeresis
keycode 247 = ediaeresis Ediaeresis
keycode 248 = idiaeresis Idiaeresis
keycode 249 = odiaeresis Odiaeresis
keycode 250 = udiaeresis Udiaeresis
keycode 251 = ssharp question backslash
keycode 252 = asciicircum degree
keycode 253 = 3 sterling
keycode 254 = Mode_switch
键代码
Backspace {BACKSPACE}、{BS} 或 {BKSP}
Break {BREAK}
Caps Lock {CAPSLOCK}
Del 或 Delete {DELETE} 或 {DEL}
向下键{DOWN}
End {END}
Enter {ENTER} 或 ~
Esc {ESC}
Help
{HELP}
Home
{HOME}
Ins 或 Insert
{INSERT} 或 {INS}
向左键
{LEFT}
Num Lock
{NUMLOCK}
Page Down
{PGDN}
Page Up
{PGUP}
Print Screen
{PRTSC}(保留供将来使用)
向右键
{RIGHT}
Scroll Lock
{SCROLLLOCK}
Tab
{TAB}
向上键
{UP}
F1
{F1}
F2
{F2}
F3
{F3}
F4
{F4}
F5
{F5}
F6
{F6}
F7
{F7}
F8
{F8}
F9
{F9}
F10
{F10}
F11
{F11}
F12
{F12}
F13
{F13}
F14
{F14}
F15
{F15}
F16
{F16}
数字键盘加号
{ADD}
数字键盘减号
{SUBTRACT}
数字键盘乘号
{MULTIPLY}
数字键盘除号
{DIVIDE}
若要指定与 Shift、Ctrl 和 Alt 键的任意组合一起使用的键,请在这些键代码之前加上以下一段或多段代码。
取余运算符 (%)
不用说自己菜不菜的,能有这个学习的精神已经很值得鼓励了呵呵,下面,我来给你介绍几个网站常见的菜单
第一个:仿网易的滑动门导航菜单
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>仿网易的滑动门技术,用DIV+CSS技术实现</title>
<style type="text/css">
<!--
#header {
background-color: #F8F4EF
height: 200px
width: 400px
margin: 0px
padding: 0px
border: 1px solid #ECE1D5
font-family: "宋体"
font-size: 12px
}
#menu {
margin: 0px
padding: 0px
list-style-type: none
}
#menu li {
display: block
width: 100px
text-align: center
float: left
margin: 0px
padding-top: 0.2em
padding-right: 0px
padding-bottom: 0.2em
padding-left: 0px
cursor: hand
}
.sec1 { background-color: #FFFFCC}
.sec2 { background-color: #00CCFF}
.block { display: block}
.unblock { display: none}
-->
</style>
</head>
<body>
<script language=javascript>
function secBoard(n)
{
for(i=0i<menu.childNodes.lengthi++)
menu.childNodes[i].className="sec1"
menu.childNodes[n].className="sec2"
for(i=0i<main.childNodes.lengthi++)
main.childNodes[i].style.display="none"
main.childNodes[n].style.display="block"
}
</script>
<div id="header">
<ul id="menu">
<li onMouseOver="secBoard(0)" class="sec2">最新新闻</li>
<li onMouseOver="secBoard(1)" class="sec1">最新文章</li>
<li onMouseOver="secBoard(2)" class="sec1">最新日志</li>
<li onMouseOver="secBoard(3)" class="sec1">论坛新帖</li>
</ul>
<!--内容显示区域-->
<ul id="main">
<li class="block">第一个内容</li>
<li class="unblock">第二个内容</li>
<li class="unblock">第三个内容</li>
<li class="unblock">第四个内容</li>
</ul>
<!--内容显示区域-->
</div>
</body>
</html>
这里基本上是使用Css与Div的结合,在整个布局中已层为单位,实行滑动菜单的是一个javascript脚本函数,调用就可以了,看不懂不要紧,日渐积累才是重要
第二个:经典实用的触发型导航(这是鼠标单击事件控制)
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<title>网页特效代码|JsCode.CN|---经典实用的触发型导航菜单</title>
</head>
<body>
<STYLE type=text/css>.sec1 {
BORDER-RIGHT: gray 1px solidBORDER-TOP:
#ffffff 1px solidBORDER-LEFT: #ffffff 1px
solidCURSOR: handCOLOR: #000000BORDER-
BOTTOM: #ffffff 1px solidBACKGROUND-COLOR:
#eeeeee
}
.sec2 {
BORDER-RIGHT: gray 1px solidBORDER-TOP:
#ffffff 1px solidFONT-WEIGHT: boldBORDER-
LEFT: #ffffff 1px solidCURSOR: handCOLOR:
#000000BACKGROUND-COLOR: #d4d0c8
}
.main_tab {
BORDER-RIGHT: gray 1px solidBORDER-
LEFT: #ffffff 1px solidCOLOR: #000000BORDER-
BOTTOM: gray 1px solidBACKGROUND-COLOR: #d4d0c8
}
</STYLE>
<!--JavaScript部分-->
<SCRIPT language=javascript>
function secBoard(n)
{
for(i=0i<secTable.cells.lengthi++)
secTable.cells
[i].className="sec1"
secTable.cells[n].className="sec2"
for(i=0i<mainTable.tBodies.lengthi++)
mainTable.tBodies
[i].style.display="none"
mainTable.tBodies
[n].style.display="block"
}
</SCRIPT>
<!--HTML部分-->
<TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
<TBODY>
<TR align=middle height=20>
<TD class=sec2 onclick=secBoard(0) width="10%">关于TBODY标记</TD>
<TD class=sec1 onclick=secBoard(1) width="10%">关于cells集合</TD>
<TD class=sec1 onclick=secBoard(2) width="10%">关于tBodies集合</TD>
<TD class=sec1 onclick=secBoard(3) width="10%">关于display属性</TD></TR></TBODY></TABLE>
<TABLE class=main_tab id=mainTable height=240 cellSpacing=0 cellPadding=0 width=549 border=0><!--关于TBODY标记-->
<TBODY style="DISPLAY: block">
<TR>
<TD vAlign=top align=middle><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>指定行做为表体。
<BR>注释:TBODY要素是块要素,并且需要结束标
签。<BR> 即使如果表格没有显式定义TBODY
要素,该要素也提供给所有表。<BR><BR>
参考:《动态HTML参考和开发应用大全》(人民邮电出
版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译)
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于cells集合-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>检索表行或者整个
表中所有单元格的集合。<BR>应用于TR、TABLE。
<BR><BR>参考:《动态HTML参考和开发应
用大全》(人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译)
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于tBodies集合-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>检索表中所有TBODY
对象的集合。对象在该集合中按照HTML源顺序排列。
<BR>应用于TABLE。<BR><BR>参考:
《动态HTML参考和开发应用大全》(人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司
译)
<BR><BR></TD></TR></TB
ODY></TABLE></TD></TR></T
BODY><!--关于display属性-->
<TBODY style="DISPLAY:
none">
<TR>
<TD vAlign=top
align=middle><BR><BR>
<TABLE cellSpacing=0
cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>设置或者检索对象
是否被提供。<BR>可能的值为block、none、
inline、list-item、table-header-group、table-
footer-group。<BR>该特性可读写,块要素默认
值为block,内联要素默认值为inline;层叠样式表
(CSS)属性不可继承。<BR><BR>参考:《
动态HTML参考和开发应用大全》(人民邮电出版社
Microsoft Corporation著
北京华中兴业科技发展有限公司译)
<BR><BR><A
href="http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/display.asp?frame=true"target=_blank>点击此处
</A>可参阅微软<A href="http://msdn.microsoft.com/" target=_blank>MSDN在线</A>上的解释。
</TD></TR></TBODY></TABLE>
</TD></TR></TBODY></TABLE&g
t</body>
</html>
这里跟上面不同的区别在与这是鼠标移动和滑动的事件区别!
第三个:仿拍拍的切换效果菜单(里面的图片是我放上去的,所以会看不到图片的,呵呵 继续)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<meta http-equiv="Content-Language" content="zh-cn" />
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<meta name="robots" content="all" />
<title>网页特效|网页特效代码(JsHtml.cn)---仿拍拍paipai.com首页产品图片随机轮显切换效果</title><style>
body {font-size:12px}
img {border:0px}
#sale{right:206pxtop:0width:260pxbackground:#fff}
#saleTitle{text-align:rightpadding-top:5pxpadding-right:5pxwidth:255pxheight:20pxbackground:url("images/saleTitle.gif") no-repeat}
#saleList{margin-top:5px}
#saleList .saleTwo{height:108pxbackground:url("images/salelineH.gif") bottom repeat-x}
#saleList a{display:blockheight:108pxwidth:86pxtext-align:centerfloat:leftoverflow:hidden}
#saleList a.saleItem{background:url("images/salelineV.gif") right repeat-y}
#saleList a img{margin:5px 0}
#saleList a:hover{background-color:#EBFFC5}
</style>
<script type="text/javascript">
rnd.today=new Date()
rnd.seed=rnd.today.getTime()
function rnd(){
rnd.seed = (rnd.seed*9301+49297) % 233280
return rnd.seed/(233280.0)
}
function rand(number){
return Math.ceil(rnd()*number)-1
}
function nextSale(order){
if(order=="up") saleNum--
else saleNum++
if(saleNum>2) saleNum=0
else if(saleNum<0) saleNum=2
//alert(saleNum)
for(i=0i<3i++)
document.getElementById("saleList"+i).style.display="none"
document.getElementById("saleList"+saleNum).style.display=""
}
</script>
</head>
<body>
<div id="sale" class="absolute overflow">
<div id="saleTitle" class="absolute">
<a href="javascript:nextSale('up')" title="点击到上一屏">
<img src="images/saleFore.gif" hspace="4" onmouseover="this.src='images/saleForeOver.gif'" onmouseout="this.src='images/saleFore.gif'" /></a><a href="javascript:nextSale('down')" title="点击到下一屏"><img src="images/saleNext.gif" onmouseover="this.src='images/saleNextOver.gif'" onmouseout="this.src='images/saleNext.gif'" /></a></div>
<div class="overflow" style="height:330px" id="saleList">
<script type="text/javascript">var saleNum=rand(3)</script>
<div id="saleList0" style="display:none">
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="圣诞浪漫饰品超级大促" src="/jsimages/UploadFiles_3321/200804/20080423085515804.jpg" width="65" height="65" /></div>
<div>
圣诞浪漫饰品<br />
超级大促</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="摄像头集结号给你新的感觉" src="/jsimages/UploadFiles_3321/200804/20080423085516472.jpg" width="65" height="65" /></div>
<div>
摄像头集结号<br />
给你新的感觉</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="好感度提升韩版娃娃装" src="/jsimages/UploadFiles_3321/200804/20080423085516162.jpg" width="65" height="65" /></div>
<div>
好感度提升<br />
韩版娃娃装</div>
</a></div>
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="复古牛仔外套特惠119元起" src="/jsimages/UploadFiles_3321/200804/20080423085516293.jpg" width="65" height="65" /></div>
<div>
复古牛仔外套<br />
特惠119元起</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="圣诞拍拍特供运动服3折" src="/jsimages/UploadFiles_3321/200804/20080423085516802.jpg" width="65" height="65" /></div>
<div>
圣诞拍拍特供<br />
运动服3折</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="摄像头集结号给你新的感觉" src="/jsimages/UploadFiles_3321/200804/20080423085516472.jpg" width="65" height="65" /></div>
<div>
摄像头集结号<br />
给你新的感觉</div>
</a></div>
<div>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="圣诞拍拍特供电脑周边4折" src="/jsimages/UploadFiles_3321/200804/20080423085516530.jpg" width="65" height="65" /></div>
<div>
圣诞拍拍特供<br />
电脑周边4折</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="party扮靓甜美腮红" src="/jsimages/UploadFiles_3321/200804/20080423085516658.jpg" width="65" width="65" height="65" /></div>
<div>
party扮靓<br />
甜美腮红</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="好感度提升韩版娃娃装" src="/jsimages/UploadFiles_3321/200804/20080423085516162.jpg" width="65" height="65" /></div>
<div>
好感度提升<br />
韩版娃娃装</div>
</a></div>
</div>
<div id="saleList1" style="display:none">
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="新奇好玩便宜尽在网游频道" src="/jsimages/UploadFiles_3321/200804/20080423085516612.jpg" width="65" height="65" /></div>
<div>
新奇好玩便宜<br />
尽在网游频道</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="展现高贵气质骑士系马靴" src="/jsimages/UploadFiles_3321/200804/20080423085516202.jpg" width="65" height="65" /></div>
<div>
展现高贵气质<br />
骑士系马靴</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="摄像头集结号给你新的感觉" src="/jsimages/UploadFiles_3321/200804/20080423085516472.jpg" width="65" height="65" /></div>
<div>
摄像头集结号<br />
给你新的感觉</div>
</a></div>
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="永不过时条纹毛衣" src="/jsimages/UploadFiles_3321/200804/20080423085516984.jpg" width="65" height="65" /></div>
<div>
永不过时<br />
条纹毛衣</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="圣诞拍拍特供运动鞋2折" src="/jsimages/UploadFiles_3321/200804/20080423085516651.jpg" width="65" height="65" /></div>
<div>
圣诞拍拍特供<br />
运动鞋2折</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="好感度提升韩版娃娃装" src="/jsimages/UploadFiles_3321/200804/20080423085516162.jpg" width="65" height="65" /></div>
<div>
好感度提升<br />
韩版娃娃装</div>
</a></div>
<div>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="精简唯美索爱K630" src="/jsimages/UploadFiles_3321/200804/20080423085516302.jpg" width="65" height="65" /></div>
<div>
精简唯美<br />
索爱K630</div>
</a>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="原装瑞士军刀精选" src="/jsimages/UploadFiles_3321/200804/20080423085516549.jpg" width="65" width="65" height="65" /></div>
<div>
原装瑞士军刀<br />
精选</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="超薄机身索爱W880" src="/jsimages/UploadFiles_3321/200804/20080423085516711.jpg" width="65" height="65" /></div>
<div>
超薄机身<br />
索爱W880</div>
</a></div>
</div>
<div id="saleList2" style="display:none">
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="各就各味秋冬饮食计划" src="/jsimages/UploadFiles_3321/200804/20080423085516704.jpg&type=3" width="65" height="65" /></div>
<div>
各就各味<br />
秋冬饮食计划</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="好感度提升韩版娃娃装" src="/jsimages/UploadFiles_3321/200804/20080423085516162.jpg" width="65" height="65" /></div>
<div>
好感度提升<br />
韩版娃娃装</div>
</a></div>
<div class="saleTwo">
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="圣诞拍拍特供随身视听5折" src="/jsimages/UploadFiles_3321/200804/20080423085516375.jpg" width="65" height="65" /></div>
<div>
圣诞拍拍特供<br />
随身视听5折</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="超薄机身索爱W880" src="/jsimages/UploadFiles_3321/200804/20080423085516711.jpg" width="65" height="65" /></div>
<div>
超薄机身<br />
索爱W880</div>
</a></div>
<div>
<a class="saleItem" href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="我爱我家家居大抢购" src="/jsimages/UploadFiles_3321/200804/20080423085516954.jpg" width="65" height="65" /></div>
<div>
我爱我家<br />
家居大抢购</div>
</a><a href="http://www.jshtml.cn" target="_blank">
<div>
<img alt="超值彩妆套装变身派对女王" src="/jsimages/UploadFiles_3321/200804/20080423085516919.jpg" width="65" width="65" height="65" /></div>
<div>
超值彩妆套装<br />
变身派对女王</div>
</a></div>
</div>
</div>
</div>
<script type="text/javascript">document.getElementById("saleList"+saleNum).style.display=""</script>
<p></p>
<p>更多网页特效代码尽在 <a href="http://www.jshtml.cn/">网页特效代码</a></p>
</body>
</html>
这个仿拍拍基本上就是2层放图片,但用起来的效果还是可以的,如果不喜欢我还有下面呢,慢慢学,总会看懂的 (最重要的还是Css哦)
这个主要就是让层实现隐藏 我觉得这个在层使用方面还是好的
从总体上看,在实现层与层之间的交互,在其代码 我觉得你有必要去认真看下 !
以上是我介绍额度菜单,虽然不是很强大,但是却很使用,而且在J2EE中
菜单基本上是一个假象,都是用层与Css之间的特效做出来的!
学会了层的具体应用,我相信你也可以有自己特色的菜单的
那我祝你好运咯!!加油!!