您好,登錄后才能下訂單哦!
JS控制按鈕禁止被選擇
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script> window.onload=function(){ document.getElementById("s").onmouseover=function(evet){ var _x=this.offsetLeft; var _y=this.offsetTop; var x=Math.random()*180+Math.random()*50; var y=Math.random()*120+Math.random()*50; this.style.position="absolute"; this.style.top=y+'px'; this.style.left=x+'px'; return false; } document.getElementById("s").onclick=function(){ alert("就知道你心里想的和表面做的是相反的!"); document.getElementById("main").style.display="none"; document.getElementById("img").style.display="block"; } document.getElementById("w").onclick=function(){ alert("寶貝:謝謝你的愛!我愛你╮(╯▽╰)╭"); document.getElementById("main").style.display="none"; document.getElementById("img").style.display="block"; } } </script> <style> *{ margin:0; padding:0; } html{ height: 100%; background:url(https://cache.yisu.com/upload/information/20200622/114/54934.gif) no-repeat; background-size: cover; } span{ width: 100%; height: 100px; display: block; text-align: center; line-height: 100px; color: #fff; } section{ } section button:nth-child(1){ position: absolute; background: #DE7C2C; left: 100px; border: 0; z-index: 1; } section button:nth-child(2){ position: absolute; z-index: 0; border: 0; background: #DE7C2C; left: 150px; } div{ width:300px; height:200px; background:rgba(34,93,146,.7); border:1px solid #eee; position:absolute; left:0; top: 0; bottom: 0; right: 0; margin: auto; } </style> </head> <body> <div id="main"> <span>親愛的我愛你,你愛我嗎?</span> <section> <button id="s" >不</button> <button id="w" >愛</button> </section> </div> <div id="img" ></div> </body> </html>
以上這篇JS控制鼠標拒絕點擊某一按鈕的實例就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持億速云。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。