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手写数组的常用函数总结

    JavaScript手写数组的常用函数总结

    这篇文章主要给大家介绍了关于JavaScript手写数组常用函数的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • 返回页面顶部top按钮通过锚点实现(自写)

    返回页面顶部top按钮通过锚点实现(自写)

    用户在使用系统时,会有很多表单的操作然而很多表单就会很长,所以就需要一个返回页面顶部的top按钮啦,于是自己写了一个,喜欢的朋友可以参考下
    2013-08-08
  • javascript仿百度输入框提示自动下拉补全

    javascript仿百度输入框提示自动下拉补全

    这篇文章主要介绍了javascript仿百度输入框提示自动下拉补全的相关资料,需要的朋友可以参考下
    2016-01-01
  • JS中封装axios来管控api的2种方式

    JS中封装axios来管控api的2种方式

    这篇文章主要介绍了封装axios来管控api的2种方式,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-09-09
  • Bootstrap模态框案例解析

    Bootstrap模态框案例解析

    这篇文章主要介绍了Bootstrap模态框案例解析,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-03-03
  • 菜单效果

    菜单效果

    菜单效果...
    2006-10-10
  • 详解微信小程序文件下载--视频和图片

    详解微信小程序文件下载--视频和图片

    这篇文章主要介绍了微信小程序文件下载视频和图片,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • JS中动态创建元素的三种方法总结(推荐)

    JS中动态创建元素的三种方法总结(推荐)

    下面小编就为大家带来一篇JS中动态创建元素的三种方法总结(推荐)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • 详解组件库的webpack构建速度优化

    详解组件库的webpack构建速度优化

    这篇文章主要介绍了详解组件库的webpack构建速度优化,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • 简单实现JavaScript图片切换效果

    简单实现JavaScript图片切换效果

    这篇文章主要教大家如何简单实现JavaScript图片切换效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11

最新评论