• 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;
            }

    结束

  • 相关阅读:
    redux-plain-english-workflow
    github入门操作
    debian 安装 android studio 环境
    [转]Linux挂载点介绍及桌面服务器分区方案
    Debian 安装 vmware-tools 手记
    linux 查看进程 和 杀死进程
    extern "C"的用法解析
    TinyXML:一个优秀的C++ XML解析器
    g++ 编译c文件
    python 压缩 解压缩 文件
  • 原文地址:https://www.cnblogs.com/zktww/p/11399782.html
Copyright © 2020-2023  润新知