视频技术

FFmpeg red5 nginx Html5 rtsp rtmp

·您当前的位置：首页 > 技术教程 > JavaScript >

[js]js写的一个网页右键菜单功能源代码

时间:2017-09-27 13:13酷播
[js]js写的一个网页右键菜单功能源代码

[js]js写的一个网页右键菜单功能源代码

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
  2. <html xmlns="http://www.w3.org/1999/xhtml">   
  3. <head>   
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
  5. <title>酷播cuplayer.com拖拽+自定义右键菜单</title>   
  6. <style type="text/css">   
  7. body{ margin:0; padding:0}   
  8. #ul1{ width:130px; height:120px; padding:10px 3px; background:#fff; border:#ACA899 1px solid; display:none; position:absolute; left:0;top:0;}   
  9. #ul1 li{ width:130px; height:28px; line-height:28px; font-size:14px; border-bottom:#ACA899 1px dashed; text-align:center; list-style:none}   
  10. #ul1 li:hover{ background:#316AC5}   
  11. </style>   
  12. <script type="text/javascript">   
  13. window.onload=function()   
  14. {   
  15. var ul=document.getElementById("ul1")   
  16. document.oncontextmenu=function(ev)   
  17. {   
  18. var evev=ev||window.event   
  19. var l=ev.clientX   
  20. var t=ev.clientY   
  21. ul.style.display="block"   
  22. ul.style.left=l+'px'   
  23. ul.style.top=t-16+'px'   
  24. return false;   
  25. }   
  26. document.onclick=function()   
  27. {   
  28. ul.style.display="none"   
  29. }   
  30. }   
  31. </script>   
  32. </head>   
  33. <body>   
  34. <ul id="ul1">   
  35. <li>酷播cuplayer.com自定义右键菜单</li>   
  36. <li>酷播cuplayer.com自定义右键菜单</li>   
  37. <li>酷播cuplayer.com自定义右键菜单</li>   
  38. <li>酷播cuplayer.com自定义右键菜单</li>   
  39. </ul>   
  40. </body>   
  41. </html>   

 

热门文章推荐

请稍候...

保利威视云平台-轻松实现点播直播视频应用

酷播云数据统计分析跨平台播放器