Javascript:阻止浏览器默认右键事件,并显示定制内容
生活随笔
收集整理的這篇文章主要介紹了
Javascript:阻止浏览器默认右键事件,并显示定制内容
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
在逛一些知名圖片社區的時候,遇到自己心怡的圖片,想要右鍵另存的時候,默認的瀏覽器菜單不見了,卻出現了如:[?kevin版權所有]之類的信息;
今天在看Javascript事件默認行為相關的知識,所以,動手實現了下類似效果:
鼠標右鍵的時候,會出現如下所示的內容
在線演示地址:http://codepen.io/anon/pen/xGyXVy
?
相關代碼:
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>javascript:事件默認行為</title><style type="text/css">#div1{display: none;position: absolute;padding: 6px 10px;color:#fff;border-radius: 3px;background-color: #666;}</style> </head> <body><div id="div1">© kevin版權所有</div><script type="text/javascript">//oncontextmenu:右鍵菜單(環境菜單)顯示的時候觸發,通過return false阻止默認事件var oDiv1=document.getElementById('div1');document.οncοntextmenu=function(ev){var ev=ev || event;var scrollTop=document.documentElement.scrollTop || document.body.scrollTop;oDiv1.style.display='block'; oDiv1.style.left=ev.clientX +scrollTop+ 'px';oDiv1.style.top=ev.clientY +scrollTop+ 'px';return false;} </script></body> </html>
?
轉載于:https://www.cnblogs.com/kevinCoder/p/4675509.html
總結
以上是生活随笔為你收集整理的Javascript:阻止浏览器默认右键事件,并显示定制内容的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Resin的安全性ip限制
- 下一篇: 2017年html5行业报告,云适配发布