LODOP中设置设置图片平铺水印,超文本透明
之前的博文:LODOP中平铺图片 文本项Repeat、 该博文中是平铺的图片,上面是文本。
如果是图片add_print_image和add_print_text纯文本,这两个打印项设计的,可以直接通过打印项的层级关系,图片在下层,文字在上层,对文字后面进行背景平铺。关于层级,可查看本博客另一篇相关博文:Lodop调整打印项输出顺序 覆盖与层级、
上面的第一个链接博文,中是用图片作为底图进行平铺,上面是add_print_text纯文本,由于lodop中的纯文本本身就是无背景色的,所以可以看到下方的背景图。
如果是超文本,除了要注意层级关系,还有注意去掉超文本本身的背景色,让超文本变透明,才能透过超文本看到底下的水印,css样式里有个设置背景色为transparent透明,可以加上这个。如果超文本本身自带背景色,那么需要去掉超文本本身的背景色。
如果不想去掉超文本的背景色,想在超文本背景色和超文本内容文字之间加上水印,让水印在背景色上面,文字下面,是不行的,因为平铺的图片和超文本是两个打印项,不可能将水印放到图片和背景色之间。
如果位置固定,或者直接用合成图,把水印和背景合成起来做成一张适合纸张的大图,目前没有发现其他的很好的处理方法。关于合成一个大图背景,可查看本博客另一篇博文的图示,或者把水印加在文字上方,但是水印部分会遮挡文字,目前发布的正式版没有加透明度的功能。
测试代码:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP</title>
<script language="javascript" src="LodopFuncs.js"></script>
<style>#p{background-color:#bbf1f2;padding:20mm;width:60mm;height:60mm;</style>
</head>
<body>
<div id="printN">
<div id="p">
官网样例是混合部署LodopFuncs.js里已经写好了判断。
客户端是浏览器支持np插件,是32位浏览器,就会提示下载32位的Lodop插件:install_lodop32.exe
客户端浏览器支持np插件,是64位浏览器,就会提示下载64位的Lodop插件:install_lodop64.exe
客户端浏览器不支持np插件(判断如高版本谷歌火狐等),会提示下载C-Lodop方式: CLodop_Setup_for_Win32NT.exe
</div>
</div>
<a href="javascript:prn1_preview()">打印预览(超文本不透明,有背景色)</a><br>
<a href="javascript:prn2_preview()">打印预览(超文本透明,可以看到底层的水印图片)</a>
<script language="javascript" type="text/javascript">
var LODOP; //声明为全局变量
function prn1_preview() {
LODOP=getLodop();
LODOP.PRINT_INIT("");
LODOP.ADD_PRINT_IMAGE(0,0,"100mm","100mm","<img src='./sy.png'>");
LODOP.SET_PRINT_STYLEA(0,"Repeat",true);
var styleN="<style>#p{background-color:#bbf1f2;padding:20mm;width:60mm;height:60mm;</style>";
LODOP.ADD_PRINT_HTM(0,0,"100%","100%",styleN+document.getElementById("printN").innerHTML);
LODOP.PRINT_DESIGN();
//LODOP.PREVIEW();
};
function prn2_preview() {
LODOP=getLodop();
LODOP.PRINT_INIT("");
LODOP.ADD_PRINT_IMAGE(0,0,"100mm","100mm","<img src='sy.png'>");
LODOP.SET_PRINT_STYLEA(0,"Repeat",true);
var styleN="<style>#p{padding:20mm;width:60mm;height:60mm;</style>";
//var styleN2="<style>#p{background-color:transparent;padding:20mm;width:60mm;height:60mm;</style>";
//或加css样式,background-color:transparent;,背景色透明
LODOP.ADD_PRINT_HTM(0,0,"100%","100%",styleN+document.getElementById("printN").innerHTML);
LODOP.PREVIEW();
};
</script>
</body>
图示:

LODOP中设置设置图片平铺水印,超文本透明的更多相关文章
- Android设置背景图片平铺
以LinearLayout为例,它提供的background属性将会将背景图片拉伸,相当难看.其实我们仅仅需做少量的改动就能够实现web编程中css背景图片的效果.来试试吧. 创建反复的背景图片 在d ...
- Android中设定背景图片平铺。
注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 在做Android开发时,我们常常需要为程序设定一个背景,但由于现在的Android设备尺寸不一,如果随便设置一个图片为背景,那么很 ...
- LODOP打印超文本保留背景色带平铺水印
前面的博文:LODOP中设置设置图片平铺水印,超文本透明. 介绍过 ,如果不想去掉超文本的背景色,想在超文本背景色和超文本内容文字之间加上水印,让水印在背景色上面,文字下面,是不行的,因为平铺的图片和 ...
- Canvas 图片平铺设置
/** * 图片平铺 */ function initDemo7(){ var canvas = document.getElementById("demo7"); if (!ca ...
- Java 在Excel中添加水印(单一水印、平铺水印)
在Excel中没有直接添加水印的功能,但依旧可以通过一定方式来实现类似水印效果.本文通过Java程序代码介绍具体实现方法.可添加单一水印效果,即水印是以单个文本字样来呈现:也可添加多个平铺水印效果,即 ...
- php 给图片增加背景平铺水印代码
如果你想利用php 给图片增加背景平铺水印效果话,必须利用php的一个插件来实例,就是利用imagick,他可以给图片增加背景平铺水印效果哦,下面我们提供一款实例代码. 如果你想利用php教程 给图片 ...
- Duilib技巧:背景图片平铺
贴图的描述 方式有两种 // 1.aaa.jpg // 2.file='aaa.jpg' res='' restype='0' dest='0,0,0,0' source='0,0,0,0 ...
- [UWP]通过自定义XamlCompositionBrushBase实现图片平铺
1. 什么是XamlCompositionBrushBase 我早就想试试自定义XamlCompositionBrushBase,但一直没机会.上一篇文章介绍到使用Win2D的BorderEffect ...
- canvas实现平铺水印
欲实现的水印平铺的效果图如下: 从图上看,应该做到以下几点: 文字在X和Y方向上进行平铺: 文字进行了一定的角度的旋转: 水印作为背景,其z-index位置应位于页面内容底部, 即不能覆盖页面主内容: ...
随机推荐
- netty: 解决粘包拆包: 分隔符DelimiterBasedFrameDecoder,定长消息FixedLengthFrameDecoder
DelimiterBasedFrameDecoder 自定义分隔符 给Server发送多条信息,但是server会讲多条信息合并为一条.这时候我们需要对发生的消息指定分割,让client和server ...
- CSP2019 爆炸记
前言 第一次去参加\(csp\),被吊打,很慌. 之前\(NOIp\)普及组勉强一等,很慌. 考的也不是很好吧,很慌. 反正菜就对了. day -? 初赛,旁边坐着本校高三爷. 初赛比之前的模拟题简单 ...
- [INS-07003] 访问 BeanStore 时出现意外错误
oracle安装时出现以下问题: 原因:未配置环境变量CLASSPASH 解决方法:新增系统变量 变量名:CLASSPASH 变量值: .;%JAVA_HOME%\lib;%JAVA_HOME%\li ...
- 通过django-crontab扩展来实现 定时任务
pip install django-crontab 基本格式 : * * * * * 分 时 日 月 周 命令 M: 分钟(0-59).每分钟用*或者 */1表示 H:小时(0-23).(0表示0点 ...
- 【微信小程序】如何获取用户绑定手机号
用户调用wx.login()方法,获取登录用户凭证code wx.login({ success: function(res) { console.log('loginCode', res.code) ...
- Codeforces 1172F Nauuo and Bug [线段树]
Codeforces 思路 定义\(f_{l,r}(x)\)表示数\(x\)从\(l\)进去\(r\)出来的时候会变成什么样子.容易发现这个函数是个分段函数,每一段都是斜率为1的一次函数,并且段数就是 ...
- 浅谈bitset
维护二进制的数据结构,常数可近似看作\(\frac{1}{32}\) 定义 bitset<4> bitset1; 长度为4,下标[0,3],默认为0 bitset<4> bit ...
- CF1188B/E Count Pairs(数学)
数同余的个数显然是要把\(i,j\)分别放到\(\equiv\)的两边 $ (a_i + a_j)(a_i^2 + a_j^2) \equiv k \bmod p $ 左右两边乘上\((a_i-a_j ...
- 记一次vue+vuex+vue-router+axios+elementUI开发(二)
开发环境跟脚手架初始完毕后,我们开始配置axios请求后台接口 axios使用说明:https://www.kancloud.cn/yunye/axios/234845 1.本人是在脚手架中的sr ...
- ZR#990
ZR#990 解法: 首先,一个 $ k $ 进制的数的末尾 $ 0 $ 的个数可以这么判断 while(x) { x /= k; cnt++;//cnt为0的个数 } 因为这道题的 $ 0 $ 的个 ...