给网站增加全屏水印

综合评论6,789,982字数 691阅读2分18秒

步骤一:

复制下面代码

步骤二:

进入wordpress后台-子比主题设置-自定义代码-自定义JavaScript,把代码粘贴进去

复制代码
  1. $(document).ready(function() {
  2. var watermark_txt = "网站名称" + getDate();
  3. watermark({"watermarl_element":"watermark-wrapper", "watermark_txt":watermark_txt});
  4. });
  5. function watermark(settings) {
  6. //默认设置
  7. var defaultSettings={
  8. watermarl_element:"body",
  9. watermark_txt:"",
  10. watermark_x:10,//水印起始位置x轴坐标
  11. watermark_y:10,//水印起始位置Y轴坐标
  12. watermark_rows:2000,//水印行数
  13. watermark_cols:2000,//水印列数
  14. watermark_x_space:50,//水印x轴间隔
  15. watermark_y_space:50,//水印y轴间隔
  16. watermark_color:'#d7d7d7',//水印字体颜色
  17. watermark_alpha:0.3,//水印透明度
  18. watermark_fontsize:'15px',//水印字体大小
  19. watermark_font:'思源黑体',//水印字体
  20. watermark_width:500,//水印宽度
  21. watermark_height:50,//水印长度
  22. watermark_angle:15//水印倾斜度数
  23. };
  24. //采用配置项替换默认值,作用类似jquery.extend
  25. if(arguments.length===1&&typeof arguments[0] ==="object" ) {
  26. var src=arguments[0]||{};
  27. for(key in src) {
  28. if(src[key]&&defaultSettings[key]&&src[key]===defaultSettings[key]){
  29. continue;
  30. } else if(src[key]){
  31. defaultSettings[key]=src[key];
  32. }
  33. }
  34. }
  35. var oTemp = document.createDocumentFragment();
  36. var maskElement=document.getElementById(defaultSettings.watermarl_element) || document.body;
  37. //获取页面最大宽度
  38. var page_width = Math.max(maskElement.scrollWidth,maskElement.clientWidth);
  39. //获取页面最大高度
  40. var page_height = Math.max(maskElement.scrollHeight,maskElement.clientHeight,maskElement.scrollTop);
  41. //水印数量自适应元素区域尺寸
  42. defaultSettings.watermark_cols=Math.ceil(page_width/(defaultSettings.watermark_x_space+defaultSettings.watermark_width));
  43. defaultSettings.watermark_rows=Math.ceil(page_height/(defaultSettings.watermark_y_space+defaultSettings.watermark_height));
  44. var x;
  45. var y;
  46. for (var i = 0; i < defaultSettings.watermark_rows; i++) {
  47. y = defaultSettings.watermark_y + (defaultSettings.watermark_y_space + defaultSettings.watermark_height) * i;
  48. for (var j = 0; j < defaultSettings.watermark_cols; j++) {
  49. x = defaultSettings.watermark_x + (defaultSettings.watermark_width + defaultSettings.watermark_x_space) * j;
  50. var mask_div = document.createElement('div');
  51. mask_div.id = 'mask_div' + i + j;
  52. mask_div.className = 'mask_div';
  53. //mask_div.appendChild(document.createTextNode(defaultSettings.watermark_txt));
  54. mask_div.innerHTML=(defaultSettings.watermark_txt);
  55. //设置水印div倾斜显示
  56. mask_div.style.webkitTransform = "rotate(-" + defaultSettings.watermark_angle + "deg)";
  57. mask_div.style.MozTransform = "rotate(-" + defaultSettings.watermark_angle + "deg)";
  58. mask_div.style.msTransform = "rotate(-" + defaultSettings.watermark_angle + "deg)";
  59. mask_div.style.OTransform = "rotate(-" + defaultSettings.watermark_angle + "deg)";
  60. mask_div.style.transform = "rotate(-" + defaultSettings.watermark_angle + "deg)";
  61. mask_div.style.visibility = "";
  62. mask_div.style.position = "absolute";
  63. mask_div.style.left = x + 'px';
  64. mask_div.style.top = y + 'px';
  65. mask_div.style.overflow = "hidden";
  66. mask_div.style.zIndex = "1029"; // 9999
  67. // pointer-events:none 让水印不遮挡页面的点击事件
  68. mask_div.style.pointerEvents='none';
  69. // 设置边框
  70. // mask_div.style.border="solid #eee 1px";
  71. // 兼容IE9以下的透明度设置
  72. mask_div.style.filter="alpha(opacity=50)";
  73. mask_div.style.opacity = defaultSettings.watermark_alpha;
  74. mask_div.style.fontSize = defaultSettings.watermark_fontsize;
  75. mask_div.style.fontFamily = defaultSettings.watermark_font;
  76. mask_div.style.color = defaultSettings.watermark_color;
  77. mask_div.style.textAlign = "center";
  78. mask_div.style.width = defaultSettings.watermark_width + 'px';
  79. mask_div.style.height = defaultSettings.watermark_height + 'px';
  80. mask_div.style.display = "block";
  81. oTemp.appendChild(mask_div);
  82. };
  83. };
  84. maskElement.appendChild(oTemp);
  85. }
  86. function getDate() {
  87. var d = new Date();
  88. var year = d.getFullYear() >= 10 ? d.getFullYear() : ('0'+d.getFullYear());
  89. var month = d.getMonth()+1 >= 10 ? d.getMonth()+1 : ('0'+d.getMonth()+1);
  90. var day = d.getDate() >= 10 ? d.getDate() : ('0'+d.getDate());
  91. var hour = d.getHours() >= 10 ? d.getHours() : ('0'+d.getHours());
  92. var minute = d.getMinutes() >= 10 ? d.getMinutes() : ('0'+d.getMinutes());
  93. var second = d.getSeconds() >= 10 ? d.getSeconds() : ('0'+d.getSeconds());
  94. return year+"-"+month+"-"+day+" "+hour+":"+minute+":"+second;
  95. }

 文章源自小武站https://1z345.cn/小武站-https://bbs.50-0.cn/599.html 文章源自小武站https://1z345.cn/小武站-https://bbs.50-0.cn/599.html

继续阅读
08月13日,星期二, 每天60秒读懂全世界!
08月13日,星期二, 每天60秒读懂全世界! 综合

08月13日,星期二, 每天60秒读懂全世界!

百度热搜新闻新闻来源:百度热搜榜1. 全红婵家乡连夜修路建停车场 近日,全红婵奥运夺冠带火家乡,游客打卡络绎不绝。村里连夜安排加宽路面、修建停车场。2. 原731部队成员抵达哈尔滨忏悔道歉 8月12日...
世界最高的蹦极地点是‌澳门旅游塔蹦极
世界最高的蹦极地点是‌澳门旅游塔蹦极 综合

世界最高的蹦极地点是‌澳门旅游塔蹦极

世界最高的蹦极在哪里蹦极多少米世界最高的蹦极地点是‌澳门旅游塔蹦极,高度为233米。澳门旅游塔蹦极位于中国澳门特别行政区,是世界上最高的商业蹦极跳台之一。澳门塔总高度达到了388米,而蹦极跳台位于塔的...
  • 本文由 admin 发表于2024年8月10日 19:32:23
  • 转载请务必保留本文链接:https://bbs.50-0.cn/599.html
  • 全屏水印
匿名

发表评论

匿名网友
确定