示例

代码

JS代码

     // Listen for the "keydown" event on the document
            document.addEventListener("keydown", function(event) {
              // Check if the pressed key is F12 (keyCode 123)
              if (event.keyCode === 123) {
                // Create a new <div> element for the message
                var messageDiv = document.createElement("div");
                messageDiv.className = "message-div";
                
                // Set the content of the <div>
                messageDiv.textContent = "代码不好看～";
                
                // Append the <div> to the body
                document.body.appendChild(messageDiv);
                
                // Remove the <div> after a few seconds (optional)
                setTimeout(function() {
                  document.body.removeChild(messageDiv);
                }, 3000); // Remove after 3 seconds (adjust as needed)
              }
            });
          
            // Listen for the "contextmenu" event on the document
            document.addEventListener("contextmenu", function(event) {
              // Prevent the default right-click context menu
              event.preventDefault();
          
              // Show the right-click prompt
              showPrompt("代码不好看～");
            });
          
            // Function to show a prompt
            function showPrompt(message) {
              // Create a new <div> element for the message
              var messageDiv = document.createElement("div");
              messageDiv.className = "message-div";
              
              // Set the content of the <div>
              messageDiv.textContent = message;
              
              // Append the <div> to the body
              document.body.appendChild(messageDiv);
              
              // Remove the <div> after a few seconds (optional)
              setTimeout(function() {
                document.body.removeChild(messageDiv);
              }, 3000); // Remove after 3 seconds (adjust as needed)
            }

CSS

    /* Styles specific to the message div */
            .message-div {
              position: fixed;
              bottom: 20px;
              left: 50%;
              transform: translateX(-50%);
              padding: 10px;
              background-color: #ffcccc;
              border: 1px solid #e74c3c;
              color: #e74c3c;
              border-radius: 5px;
              z-index: 9999; /* Ensure it's above other elements */