div 垂直居中显示
<div id="popbox_sw" class="popbox_sw" style="display:none;position:absolute;z-index:100; border:solid 1px #79BCFF; background-color: #EEF2FB;">
<div class="popupheader"><i18n:message key="cert.assigncertsum.title.submit.result.title" bundle="<%=bundle%>" /><div class="closebutton" onClick="closewindow();">
<i18n:message key="cert.assigncertsum.title.submit.result.close" bundle="<%=bundle%>" />
<html:img src="GSHPICON_CLOSE.gif" onClick="closewindow();" /></div></div>
<div class="popcontent_il">
<ul>
<li><i18n:message key="cert.assigncertsum.title.submit.result.content" bundle="<%=bundle%>" /></li>
</ul>
</div>
<script language="JavaScript">
function showWindow(){
mask=document.createElement("div");
var W=$(document).width();
var H=$(document).height();
mask.id="mask";
mask.style.cssText="position:absolute;z-index:99;width:"+W+"px;height:"+H+"px;background:#000;filter:alpha(opacity=30);opacity:0.3;top:0;left:0;";
document.body.appendChild(mask);
var o = document.getElementById("popbox_sw");
o.style.display="block";
}
function closewindow(){
document.getElementById("popbox_sw").style.display = "none";
var node = document.getElementById("mask");
document.body.removeChild(node);
}
</script>
<script>
(function($){
$(function(){
function keywordCheck(){
var screenx = $(window).width();
var screeny = $(window).height();
var checkx = (screenx - $('#popbox_sw').width())/2;
var checky = (screeny - $('#popbox_sw').height())/2;
$('#popbox_sw').css({top: checky + "px",left: checkx + "px"});
}
$(document).ready(function(){
keywordCheck();
});
$(window).resize(function(){
keywordCheck();
});
});
})(jQuery);
</script>
分享到:
相关推荐
DIV 垂直居中DIV 垂直居中DIV 垂直居中DIV 垂直居中DIV 垂直居中DIV 垂直居中
div框水平垂直居中跟内容垂直居中
该html代码是实现DIV居中及DIV垂直居中的实例,包括: div居中, div内文本居中及垂直居中, div嵌套div并居中, div嵌套div并垂直居中.
div垂直居中屏幕的方法,兼容IE6 7 8 Firefox
### DIV垂直居中的N种方法:详尽解析与实践 在网页设计中,DIV元素的垂直居中一直是前端开发者关注的焦点。无论是响应式布局的需求,还是美观度的提升,垂直居中的实现都能显著增强用户体验。本文将深入探讨并演示...
### CSS解决未知高度的DIV垂直居中 #### 知识点概述 在Web开发中,实现元素的垂直居中是一项常见的需求。对于已知高度的元素来说,这相对容易实现。但对于那些高度未知或者动态变化的元素,尤其是嵌套在另一个未知...
在网页设计中,"垂直居中显示"是一个常见的需求,特别是在多设备、多屏幕尺寸的环境下,确保元素在页面上无论何时都能保持居中状态,能够提供良好的用户体验。本话题主要探讨如何在IE7及以上的浏览器中实现元素的...
任意图片在div里的垂直居中!
在网页设计中,让一个`div`元素在页面上实现水平和垂直居中是一项常见的需求。这个主题,"DIV水平垂直居中",通常涉及到CSS布局技术和可能的JavaScript辅助方法。在这个场景中,描述提到使用了jQuery来实现,这是一...
DIV+CSS 水平垂直居中网页学习 DIV+CSS 水平垂直居中是Web开发中一个常见的问题,如何将DIV元素水平垂直居中是一个非常重要的知识点。本文将详细介绍DIV+CSS水平垂直居中的方法和实现原理。 一、使用position:...
在网页设计中,实现元素的垂直居中和水平居中是一项常见的需求,这涉及到CSS布局技术。本篇文章将深入探讨如何使用div+css方法来实现这一目标。在现代Web开发中,div元素作为布局容器广泛使用,而CSS则是样式控制的...
在网页设计中,"DIV+CSS 图片垂直居中效果"是一个常见的布局需求,它涉及到CSS的盒模型、定位和Flexbox或Grid等现代布局技术。以下是对这一主题的详细阐述: 1. **基础概念** - **DIV**:HTML中的`<div>`元素是一...
例如,设置`div`的`height`和`line-height`为`25px`,这样文本就会在`div`中垂直居中显示。此外,为了防止内容超出容器或自动换行,可以添加`overflow:hidden`属性。 第二种方法适用于多行未知高度的文本垂直居中。...
通过上述方法,结合适当的CSS和HTML代码,即使在JSP页面中也能有效地使图片在div中水平和垂直居中显示。在实际应用时,还需注意图片的尺寸要适当配合div容器的尺寸,以达到最佳的视觉效果。 最后,还需提一下,如果...
在网页设计中,将图片在div中垂直和水平居中是一项常见的需求,这涉及到CSS布局技术的运用。本文将深入探讨如何使用最简单的方法来实现这个目标,同时也会涉及JavaScript(JS)的一些特效,尽管在描述中没有明确指出...
例如,垂直居中和水平居中可以分别使用Grid和Flexbox来实现。 在提供的`demo.html`文件中,可能包含了这些居中布局的示例代码。`logo.png`可能是用来测试这些布局效果的图片。通过查看和分析这些文件,可以进一步...
通用所有浏览器, 欢迎大家分享。 绝对是真的
在网页设计中,让多行文字在`div`元素中垂直居中是一项常见的需求,尤其在构建响应式布局和用户界面时。实现这个效果的方法多种多样,每种方法都有其适用场景和优缺点。以下是一些主要的策略来实现`div`中多行文字的...
在网页设计中,让元素居中是常见的需求,特别是对于`div`这样的块级元素,垂直居中有时会显得较为复杂。本示例将详细解释如何使用CSS来实现`div`元素的垂直居中。 首先,我们要理解CSS布局的基本概念。在网页中,...