JS 打印图片

在使用window.print()进行打印时,打印的内容可能会包含图片内容,此时的图片内容不能设置为背景图片,否则将无法再打印页面显示。

<!doctype html>
<html>
    <head>
        <title></title>
        <script type="text/javascript">
            function printfun(){
                window.print();
            }
        </script>
    </head>
    <body>
        <input type="button" value="打印" onclick="printfun()"><br/>
        下面设置的img图片:
        <div>
            <img src="images/moganna.png">
        </div>

        下面图片是背景图片:
        <div style="background: url(‘images/moganna.png‘); width: 500px; height: 291px;">

        </div>
    </body>
</html>

 

时间: 2024-10-05 10:09:28

JS 打印图片的相关文章

页面性能优化-原生JS实现图片懒加载

在项目开发中,我们往往会遇到一个页面需要加载很多图片的情况.我们可以一次性加载全部的图片,但是考虑到用户有可能只浏览部分图片.所以我们需要对图片加载进行优化,只加载浏览器窗口内的图片,当用户滚动时,再加载更多的图片.这种加载图片的方式叫做图片懒加载,又叫做按需加载或图片的延时加载.这样做的好处是:1.可以加快页面首屏渲染的速度:2.节约用户的流量. 一.实现思路 1.图片img标签自定义一个属性data-src来存放真实的地址. 2.当滚动页面时,检查所有的img标签,判断是否出现在事业中,如果

JS获取图片的缩略图,并且动态的加载多张图片

找了好多资料也没有找到该死的ie的解决办法,最后放弃了ie <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>js获取缩略图</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <st

JS打印和报表输出

JS打印和报表输出2008-07-15 22:16一打印: 转自:http://hi.baidu.com/afei0211/blog/item/20523955ca8bebc2b745ae98.html (1) 在实际应用中!特别是一些公司需要报表输出和打印!这个时候我们就会用到JS的打印和报表输出功能!当然打印很简单就是window.print();你也可以在按钮的onclick事件中写上return print()可以实现打印效果!这个时候打印你会发现打印出来的是整个页面,包裹着网站的log

原生JS编写图片切换效果和点击按钮的样式变化

这两天更进一步的了解了JS,老师让我们用原生的js编写图片切换和改变点击按钮样式,就是让我们学会怎么去把一个问题拆分,怎么将一个大问题拆分成许多的小问题,再用函数封装起来.比如一个点击按钮,让其点击时背景色发生改变,点击另一个时,上一个按钮要变回原来本有的颜色:这个问题用jquery,一行代码就搞定,但是用原生js就得分三个部分来考虑: 1.添加改变背景的样式. 2.怎么获取到除了当前点击的按钮以外其他的兄弟节点. 3.怎么去除按钮的样式属性. 也讲了事件委托,实现了可以删除新添加的元素的功能.

【COCOS2DX-LUA 脚本开发之十二】Hybrid模式-利用AssetsManager实现在线更新脚本文件lua、js、图片等资源(免去平台审核周期)

转载自:http://www.himigame.com/iphone-cocos2dx/1354.html 首先说明一个问题: 为什么要在线更新资源和脚本文件!? 对于此问题,那要说的太多了,简单概括,如果你的项目已经在google play 或Apple Store 等平台上架了,那么当你项目需要做一些活动或者修改前端的一些代码等那么你需要重新提交一个新版本给平台,这时候你的上架时候是个不确定的时候,具体什么时候能上架,主要跟平台有关,你再着急,也没有用的. 那么如果你的项目是使用脚本语言进行

分别用css3、JS实现图片简单的无缝轮播功效

本文主要介绍分别使用CSS3.JS实现图片简单无缝轮播功效: 一.使用CSS3实现:利用animation属性 (实现一张一张的轮播,肉眼只看见一张图片) HTML部分比较简单,两个div下包着几个img标签:为了实现无缝轮播,注意第一张图片要与最后一张图片相同: <div class="out"> <div class="imgs"> <img src="img/beatuy.jpg"/> <img s

asp.net MVC发布iis无法加载css,js和图片

今天真够郁闷的,遇到了在本地能运行的项目到了iis服务器那里就不行了,无法加载css,js和图片,这里说清楚一下先,关于asp.net 的MVC中这样的情况其实不少,但是之前遇到的是在visual studio运行的时候就已经不能加载css和js文件,那种情况一般都是路径的问题,改下页面代码就行,网上教程不少,而这个其实是一个CMS的开源系统.Orchard,国庆实在无聊,就想玩下这个asp.net MVC框架的CMS,而且是微软推荐的开源CMS,提到了就来说说这个吧,和国内的其他CMS对比起来

兼容ie[6-9]、火狐、Chrome、opera、maxthon3、360浏览器的js本地图片预览

html代码: <div id="divPreview"> <img id="imgHeadPhoto" src="Images/Headphoto/noperson.jpg" style="width: 160px; height: 170px;border: solid 1px #d2e2e2;" alt="" /> </div> <asp:FileUpload

js判断图片加载完成

<!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <img id="mainPic" src="http://img1c.xgo-img