Html加水印和禁用復制和右鍵(jquery.watermark.js)


近期遇到一個需求,需要在頁面背景加上自己的水印和禁止用戶在頁面復制粘貼


 解決:

水印使用的是jquery.watermark.js插件,這個插件可以在html背景上加水印,同時可以設置相關屬性值。

相關代碼如下:

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>test</title>
    <style type="text/css">
        body, html{
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
    <script src="http://code.jquery.com/jquery-git.js"></script>
    <script src="jquery.watermark.js"></script>
</head>
<body >
     <script type="text/javascript">
        $('body').watermark({
            texts : ["這是測試", "這是測試2"], //水印文字
            textColor : "#d2d2d2", //文字顏色
            textFont : '14px 微軟雅黑', //字體
            width : 100, //水印文字的水平間距
            height : 100,  //水印文字的高度間距(低於文字高度會被替代)
            textRotate : -30 //-90到0, 負數值,不包含-90
        })
     </script>
</body>
</html>

 注意:這個插件需要在引用了jquery的基礎上使用


 效果如下:


禁用復制和右鍵代碼如下:

     //禁止復制和右鍵另存為
        function iEsc() { return false;}
        function iRec() { return true;}
        function DisableKeys() {
            if (event.ctrlKey || event.shiftKey || event.altKey) {
                window.event.returnValue = false;
                iEsc();
            }
        }
        document.ondragstart = iEsc;
        document.onkeydown = DisableKeys;
        document.oncontextmenu = iEsc;
        if (typeof document.onselectstart != "undefined")
            document.onselectstart = iEsc;
        else {
            document.onmousedown = iEsc;
            document.onmouseup = iRec;
        }

結束


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM