JS 打印界面的CSS居中代码适用所有浏览器

 更新时间:2014年03月19日 15:55:53   作者:  
这篇文章主要介绍了JS 打印界面的CSS居中代码,需要的朋友可以参考下
复制代码 代码如下:

function preview(oper) {
if (oper < 10) {
bdhtml = window.document.body.innerHTML;//获取当前页的html代码
sprnstr = "<!--startprint" + oper + "-->";//设置打印开始区域
eprnstr = "<!--endprint" + oper + "-->";//设置打印结束区域
prnhtml = bdhtml.substring(bdhtml.indexOf(sprnstr) + 18); //从开始代码向后取html

prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr));//从结束代码向前取html
window.document.body.innerHTML = prnhtml;
window.print();
window.document.body.innerHTML = bdhtml;
} else {
window.print();
}

}
#outer {
display:table;
height:400px;
#position:relative;
overflow:hidden;
}
#middle {
display:table-cell;
vertical-align:middle;
#position:absolute;
#top:50%;
}
#inner {
#position:relative;
#top:-50%;
}



<div id=”outer”>
<div id=”middle”>
<div id=”inner”>
<!–这里是要垂直居中的内容–>
</div>
</div>
</div>

相关文章

  • JavaScript canvas复刻苹果发布会环形进度条

    JavaScript canvas复刻苹果发布会环形进度条

    canvas 真是一个好东西,它给前端插上了想象的翅膀,伴随着 h5 而来,将 web 代入了新的领域。本文将利用anvas复刻苹果发布会环形进度条,感兴趣的可以尝试一下
    2022-07-07
  • cropperjs实现裁剪图片功能

    cropperjs实现裁剪图片功能

    这篇文章主要为大家详细介绍了cropperjs实现裁剪图片功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-02-02
  • javascript中关于&& 和 || 表达式的小技巧分享

    javascript中关于&& 和 || 表达式的小技巧分享

    我将会介绍和解析12个简单但是强大的JavaScript技巧. 这些技巧所有的JavaScript程序员都可以马上使用, 你不需要成为JavaScript高手才能理解这些.下面我们开始本系列的第一篇文章,介绍下强大的&& 和 || 表达式
    2015-04-04
  • Bootstrap选项卡动态切换效果

    Bootstrap选项卡动态切换效果

    这篇文章主要为大家详细介绍了Bootstrap选项卡动态切换效果,点击登录和注册可以实现任意切换,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • 微信小程序基础教程之echart的使用

    微信小程序基础教程之echart的使用

    简单的使用echarts不难,但是在小程序里用echarts可能有些理不清。所以这篇文章主要给大家介绍了关于微信小程序基础教程之echart使用的相关资料,需要的朋友可以参考下
    2021-06-06
  • 微信小程序实现收藏与取消收藏切换图片功能

    微信小程序实现收藏与取消收藏切换图片功能

    这篇文章主要介绍了微信小程序实现收藏与取消收藏切换图片功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-08-08
  • 分析uniapp如何动态获取接口域名

    分析uniapp如何动态获取接口域名

    本文主要介绍了uniapp如何动态获取接口域名,感兴趣的同学,可以参考下,并且试验一下。
    2021-06-06
  • javascript 极速 隐藏/显示万行表格列只需 60毫秒

    javascript 极速 隐藏/显示万行表格列只需 60毫秒

    隐藏表格列 这种方式的效率极低。例如,隐藏一个千行表格的某列,在我的笔记本(P4 M 1.4G,768M内存)上执行需要约 4000毫秒的时间,令人无法忍受。
    2009-03-03
  • 微信小程序网络请求模块封装的具体实现

    微信小程序网络请求模块封装的具体实现

    大家做小程序项目的时候肯定会遇到数据对接需求,下面这篇文章主要给大家介绍了关于微信小程序网络请求模块封装的具体实现,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-03-03
  • 详解JS如何处理可视区域图片懒加载技巧

    详解JS如何处理可视区域图片懒加载技巧

    这篇文章主要为大家介绍了JS如何处理可视区域图片懒加载技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-06-06

最新评论