已安装Dreamweaver或其它网页编辑器的电脑一台
HTML网页打开,一开始显示如图。
鼠标右键之后显示自定义右键菜单。END
HTML代码:
- JavaScript 学习
- 响应用户操作
- 事件驱动
- 元素属性操作
- 函数传参
- JavaScript组成
- JavaScript出现的位置、优缺点
- 变量、类型、变量作用域
- 闭包
- 运算符
- 程序流程控制
- 定时器的使用
CSS代码:body, div, ul, li { margin:0; padding:0; }body { font:12px/1.5 \5fae\8f6f\96c5\9ed1; }ul { list-style-type:none; }#cen {font-size:36px; color:#60F; text-align:center;}#div1 { position:absolute; display:none; }#div1 ul { position:absolute; float:left; border:1px solid #979797;background:#f1f1f1; padding:2px; box-shadow:2px 2px 2px rgba(0, 0, 0, .6); width:230px; overflow:hidden; }#div1 ul li { float:left; clear:both; height:24px; cursor:pointer; line-height:24px; white-space:nowrap; padding:0 30px; width:100%; display:inline-block; }#div1 ul li:hover { background:#E6EDF6; border:1px solid #B4D2F6; }END
JavaScript代码:document.oncontextmenu = function (ev){var oEvent=ev||event;var oDiv=document.getElementById('div1'); oDiv.style.display='block';oDiv.style.left=oEvent.clientX+'px';oDiv.style.top=oEvent.clientY+'px'; return false;};document.onclick=function (){var oDiv=document.getElementById('div1'); oDiv.style.display='none';};END
注意JavaScript代码的书写