您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“怎么用Javascript實現Agent”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“怎么用Javascript實現Agent”這篇文章吧。
既然是顯示右鍵菜單,那么我們就要截獲對精靈按右鍵時的事件oncontextmenu
然后將右鍵菜單的html封裝到一個函數,一上來這個菜單層是隱藏的
function getMenuHtml()
{
var menuHtml ="
";
menuHtml += "
";
menuHtml += "";
menuHtml += "";
menuHtml += "";
menuHtml += "
"; menuHtml += "Menu1"; menuHtml += " |
";
menuHtml += "
";
return menuHtml;
}
實現右鍵菜單,我們需要精靈截獲oncontextmenu事件,需要對昨天的run函數進行一點小的修改
Agent.prototype.run=function()
{
var agentHtml = "";
agentHtml += "";
agentHtml += getMenuHtml();
return document.write(agentHtml);
}
可以看出oncontextmenu調用的是showRightMenu函數,這個函數使菜單層可見,并且顯示位置隨著鼠標的位置而顯示
注解:
scrollLeft:設置或獲取位于對象左邊界和窗口中目前可見內容的最左端之間的距離
scrollTop:設置或獲取位于對象最頂端和窗口中可見內容的最頂端之間的距離
event.clientX:鼠標點擊的x軸位置
event.clientY:鼠標點擊的y軸位置
/*
* 右鍵菜單 v1.0
* author: 清風
*/
function showRightMenu()
{
menu.style.left=document.body.scrollLeft+event.clientX
menu.style.top=document.body.scrollTop+event.clientY
menu.style.visibility="visible";
return false;
}
菜單現在可以顯示了,如何使其消失呢?應當是用戶點擊任意位置就可消失
document.onclick=click
function click()
{
menu.style.visibility="hidden";
}
以上是“怎么用Javascript實現Agent”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。