»
Tiếng AnhTiếng PhápTiếng Việt

In - Menu chuột trái - JavaScriptBank.com

Phiên bản đầy đủ: jsB@nk » Trình đơn » Trình đơn chuột phải » Menu chuột trái
URL: https://www.javascriptbank.com/speed-pop-up-v11.html

Menu chuột trái © JavaScriptBank.comHiệu ứng làm xuất hiện một trình đơn khi bạn nhấp trái chuột vào khoảng trống bất kì trên trang web.

Phiên bản đầy đủ: jsB@nk » Trình đơn » Trình đơn chuột phải » Menu chuột trái
URL: https://www.javascriptbank.com/speed-pop-up-v11.html



CSS
<style type="text/css">#menuDiv {position:absolute; left:0; top:0; width:137; height:250; clip:rect(0,137,250,0); background-color:000000; layer-background-color:000000; visibility:hidden;}#menuLayer1Div {position:absolute; left:0; top:0; width:136; height:249; clip:rect(0,136,249,0); background-color:888888; layer-background-color:888888;}#menuLayer2Div {position:absolute; left:1; top:1; width:134; height:247; clip:rect(0,134,247,0); background-color:D0D0D0; layer-background-color:D0D0D0;}#menuLayer3Div {position:absolute; left:0; top:0; width:135; height:248; clip:rect(0,135,248,0); background-color:C0C0C0; layer-background-color:C0C0C0;}#menuLayer4Div {position:absolute; left:1; top:1; width:1; height:247; clip:rect(0,1,247,0); background-color:E0E0E0; layer-background-color:E0E0E0;}#menuLayer5Div {position:absolute; left:1; top:1; width:134; height:1; clip:rect(0,134,1,0); background-color:E0E0E0; layer-background-color:E0E0E0;}#menuLayer6Div {position:absolute; left:3; top:3; width:131; height:20; clip:rect(0,131,20,0); background-color:8888FF; layer-background-color:8888FF;}A.JSmenu {color:black;}#input0Div {position:absolute; left:3; top:23; width:131; height:20; clip:rect(0,131,20,0); background-color:C0C0C0; layer-background-color:C0C0C0;}#input1Div {position:absolute; left:3; top:43; width:131; height:20; clip:rect(0,131,20,0); background-color:C0C0C0; layer-background-color:C0C0C0;}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script>// Some Codes in this document is based on DHTML script by// Dan Steinman of Industrial Dreamsvar ItemEntry = new Array()// Varibles can be changed freelyMenuWidth = 137// Width of the pop-up menuMenuHeight = 250// Height of the pop-up menuItemInMenu = 2// How many items are in the menu// Setup your menu wordsItemEntry[0] = new MenuEntry("My JS Page","http://JavaScriptBank.com/")ItemEntry[1] = new MenuEntry("Javascript.com","http://JavaScriptBank.com/")var menuEle = new Array(ItemInMenu)// DO NOT MODIFY THE CODE BELOWfunction MenuEntry(cap,adrs) {this.cap = capthis.adrs = adrs}n = (document.layers) ? 1:0ie = (document.all) ? 1:0function init() {// initialize objectsmenu = new dynLayer("menuDiv",null)for (var k = 0; k < menuEle.length; k++) {menuEle[k] = new dynLayer("input" + k + "Div","menuDiv")}menu.hide()// initialize eventsdocument.onmousedown = mouseDowndocument.onmousemove = mouseMovedocument.onmouseup = mouseUpif (n) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)}// Temperary Variblesshowing = false// drag variablesdragActive = 0dragObject = nulldragArray = new Array()dragLayerX = 0dragLayerY = 0dragLayerZ = 0function mouseDown(e) {if (n) {if (showing == true) {showing = false; setTimeout('menu.hide()',50)}else if (((n && e.which == 1) || ie) && showing == false) {     if (n) {var xNow=e.pageX; var yNow=e.pageY}if (ie) {var xNow=event.x; var yNow=event.y}menu.moveTo(xNow, yNow)menu.show()showing = true}}else if (ie) {if (showing == true) {showing = false; menu.hide()}else if (((n && e.which == 1) || ie) && showing == false) {if (n) {var xNow=e.pageX; var yNow=e.pageY}if (ie) {var xNow=event.x; var yNow=event.y}menu.moveTo(xNow, yNow)menu.show()showing = true}}}function mouseMove(e) {if (n) {var x=e.pageX; var y=e.pageY}if (ie) {var x=event.x; var y=event.y}}function mouseUp(e) {if (n) {var x=e.pageX; var y=e.pageY}if (ie) {var x=event.x; var y=event.y}dragActive = 0// put more code here to do something else when finished a drag}function dynLayer(id,nestref,des) {if (n) {if (nestref) {this.css = eval("document." + nestref + ".document." + id)this.ref = eval("document." + nestref + ".document." + id + ".document")}else {this.css = document.layers[id]this.ref = document.layers[id].document}this.x = this.css.leftthis.y = this.css.topthis.w = this.css.clip.widththis.h = this.css.clip.height}else if (ie) {this.css = document.all[id].stylethis.ref = documentthis.x = this.css.pixelLeftthis.y = this.css.pixelTopthis.w = this.css.pixelWidththis.h = this.css.pixelHeight}this.obj = id + "Object"eval(this.obj + "=this")this.moveBy = dynLayerMoveBythis.moveTo = dynLayerMoveTothis.show = dynLayerShowthis.hide = dynLayerHide}function dynLayerMoveBy(x,y) {this.x += xthis.css.left = this.xthis.y += ythis.css.top = this.y}function dynLayerMoveTo(x,y) {this.x = xthis.css.left = this.xthis.y = ythis.css.top = this.y}function dynLayerShow() {if (n) this.css.visibility = "show"else if (ie) this.css.visibility = "visible"}function dynLayerHide() {if (n) this.css.visibility = "hide"else if (ie) this.css.visibility = "hidden"}document.writeln('<STYLE TYPE=\"text\/css\">')document.writeln('#menuDiv {position:absolute; left:0; top:0; width:' + MenuWidth + '; height:' + MenuHeight + '; clip:rect(0,' + MenuWidth + ',' + MenuHeight + ',0); background-color:000000; layer-background-color:000000; visibility:hidden;}')document.writeln('#menuLayer1Div {position:absolute; left:0; top:0; width:' + (MenuWidth  -1) + '; height:' + (MenuHeight -1) + '; clip:rect(0,' + (MenuWidth -1) + ',' + (MenuHeight -1) + ',0); background-color:888888; layer-background-color:888888;}')document.writeln('#menuLayer2Div {position:absolute; left:1; top:1; width:' + (MenuWidth -3) + '; height:' + (MenuHeight-3) + '; clip:rect(0,' + (MenuWidth-3) + ',' + (MenuHeight -3) + ',0); background-color:D0D0D0; layer-background-color:D0D0D0;}')document.writeln('#menuLayer3Div {position:absolute; left:0; top:0; width:' + (MenuWidth -2) + '; height:' + (MenuHeight-2) + '; clip:rect(0,' + (MenuWidth-2) + ',' + (MenuHeight -2) + ',0); background-color:C0C0C0; layer-background-color:C0C0C0;}')document.writeln('#menuLayer4Div {position:absolute; left:1; top:1; width:1; height:' + (MenuHeight -3) + '; clip:rect(0,1,' + (MenuHeight -3) + ',0); background-color:E0E0E0; layer-background-color:E0E0E0;}')document.writeln('#menuLayer5Div {position:absolute; left:1; top:1; width:' + (MenuWidth -3) + '; height:1; clip:rect(0,' + (MenuWidth -3) + ',1,0); background-color:E0E0E0; layer-background-color:E0E0E0;}')document.writeln('#menuLayer6Div {position:absolute; left:3; top:3; width:' + (MenuWidth -6) + '; height:20; clip:rect(0,' + (MenuWidth -6) + ',20,0); background-color:8888FF; layer-background-color:8888FF;}')document.writeln('A.JSmenu {color:black;}')for (var k = 0; k < menuEle.length; k++) {document.writeln('#input' + k + 'Div {position:absolute; left:3; top:' + (20 * (k+1) + 3) + '; width:' + (MenuWidth-6) + '; height:20; clip:rect(0,' + (MenuWidth -6) + ',20,0); background-color:C0C0C0; layer-background-color:C0C0C0;}')}document.writeln('<\/STYLE>')document.writeln('<DIV ID="menuDiv">')document.writeln('<DIV ID="menuLayer1Div"></DIV>')document.writeln('<DIV ID="menuLayer2Div"></DIV>')document.writeln('<DIV ID="menuLayer3Div"></DIV>')document.writeln('<DIV ID="menuLayer4Div"></DIV>')document.writeln('<DIV ID="menuLayer5Div"></DIV>')document.writeln('<DIV ID="menuLayer6Div"><FONT Size=2><A CLASS="JSmenu" HREF="http://members.xoom.com/7432/PopUpMenu.htm"><CENTER>Speed Pop-Up v1.1</CENTER></A></FONT></DIV>')for (var k = 0; k < menuEle.length; k++) {document.writeln('<DIV ID="input' + k + 'Div">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<FONT FACE="Helvetica" SIZE="1"><A CLASS="JSmenu" HREF="' + ItemEntry[k].adrs + '">' + ItemEntry[k].cap + '</FONT></A></DIV>')}document.writeln('</DIV>')init()</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<div id="menuDiv"><div id="menuLayer1Div"></div><div id="menuLayer2Div"></div><div id="menuLayer3Div"></div><div id="menuLayer4Div"></div><div id="menuLayer5Div"></div><div id="menuLayer6Div"><font size="2"><a class="JSmenu" href="http://JavaScriptBank.com/"><center>Speed Pop-Up v1.1</center></a></font></div><div id="input0Div">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font face="Helvetica" size="1"><a class="JSmenu" href="http://JavaScriptBank.com/">My JS Page</a></font></div><div id="input1Div">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<font face="Helvetica" size="1"><a class="JSmenu" href="http://JavaScriptBank.com/">JSBank</a></font></div></div><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->