相关疑难解决方法(0)
中心位置:固定元素
我想position: fixed;以一个动态宽度和高度制作一个以屏幕为中心的弹出框.我用过margin: 5% auto;这个.没有position: fixed;它水平中心,但不垂直.添加后position: fixed;,它甚至不会水平居中.
这是完整的集合:
.jqbox_innerhtml {
position: fixed;
width: 500px;
height: 200px;
margin: 5% auto;
padding: 10px;
border: 5px solid #ccc;
background-color: #fff;
}<div class="jqbox_innerhtml">
This should be inside a horizontally
and vertically centered box.
</div>如何使用CSS将此框置于屏幕中心？
推荐指数
解决办法
查看次数
CSS中的负边距如何工作以及为什么(保证金最高:-5!=保证金底部:5)？
垂直定位元素的常见技巧是使用以下CSS:
.item {
position:absolute;
top:50%;
margin-top:-8px; /* half of height */
height: 16px;
}
如在Chrome中一样在公制视图中看到,这就是您所看到的:
但是,当您将鼠标悬停在元素上时,没有描绘视觉边距,即边距位于边界"外部"并且可以显示.但负利润率并未出现.它们看起来如何,它与众不同之处是什么？
为什么margin-top:-8px 不一样 margin-bottom:8px？
那么负利润如何运作以及它们背后的直觉是什么呢？他们如何"提升"(如果是margin-top < 0)一件物品？
推荐指数
解决办法
查看次数
推荐指数
解决办法
查看次数
以未知宽度居中的div
我有div <div id="container"></div>包含所有页面内容,包括页眉页脚等.
所以我想把这个div放在我页面的中心,现在我有这个css:
#page{
position:relative;
margin:auto;
width:1000px;
}
它的工作原理,但我的问题是这个div中的内容不断变化所以宽度也会发生变化,它可能是1000px或者10100px我需要类似的东西width:auto;,怎么能做到这样呢？
推荐指数
解决办法
查看次数
为什么是顶级:50%的css不工作？
我正在建立一个网站,我正试图垂直居中:
position: absolute;
width:1200px;
height:600px;
top: 50%;
left: 50%;
margin-left: -600px;
我的HTML是一个单一的 div
推荐指数
解决办法
查看次数
如何使用jQuery和blockUI将DIV置于页面中心？
我正在尝试转换Matt Berseth的' YUI Style Yes/No Confirm Dialog ',所以我可以将它与jQuery blockUI插件一起使用.
我不得不承认我不是CSS大师,但我认为即使对我来说这也很容易....除了10个小时之后我不知道为什么我不能让爆炸的东西工作.
问题是我似乎无法让'confirmDialogue'DIV在页面上居中,而上面没有显示任何工件.或者,如果我通过执行....重置blockUI的CSS设置:
$.blockUI.defaults.css = {};
.....我发现DIV左对齐.
我已经尝试了各种各样的东西但CSS不是我的强点是服务器端应用程序有点人:(
所以,如果那里的任何人都是jQuery/blockUI/CSS向导阅读这个...请你去试试让我知道我错了什么？
基本上我遵循Matt博客上的设计模板,HTML看起来像下面的内容(CSS与Matt的样本没有变化).您可以从http://mattberseth2.com/downloads/yui_simpledialog.zip上的完整示例项目下载中获取png'sprite'文件- 这是一个.net项目,但我只是想让它在一个简单的html中工作文件,因此不需要.NET知识.
无论如何,任何建议和指导真的非常有用.如果我们见面的话,我甚至会鼓励那些有希望买啤酒的人买的东西:)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
<script type="text/javascript" src="script/jquery-1.2.6.js"></script>
<script type="text/javascript" src="script/jquery.blockUI.js"></script>
<style>
.modalpopup
{
font-family: arial,helvetica,clean,sans-serif;
font-size: small;
padding: 2px 3px;
display: block;
position: absolute;
}
.container
{
width: 300px;
border: solid 1px #808080;
border-width: 1px 0px;
}
.header
{
background: url(img/sprite.png) repeat-x 0px -200px;
color: #000;
border-color: #808080 #808080 …推荐指数
解决办法
查看次数
jQuery:Animate Margins to Auto？
我正在尝试为图像设置动画,使其自身居中.这是我想要使用的代码:
$('#myImage').animate({'margin-right': 'auto'});
但是,当我这样做时,它被忽略了,并没有改变边际.
有没有办法将边距设置为自动或以图像为中心？
谢谢!
推荐指数
解决办法
查看次数
使用JQuery从中心动画中成长
我希望从一个按钮有一个弹出窗口.单击该按钮时,我希望弹出窗口从按钮的中心向外增长,同时滑动到屏幕的中心.我不认为这应该太难,但我无法在任何地方找到任何片段.任何帮助将不胜感激.
感谢Jamie Dixon的帮助,我得到了这段代码.
$('#grower').css({
backgroundColor: '#FFFFFF',
border: '10px solid #999',
height: '0px',
width: '0px',
color: '#111111',
fontWeight: 'bold',
padding: '10px',
display: 'none',
position: 'absolute',
left: $(this).position().left,
top: $(this).position().top
}).appendTo('#overlay').fadeIn(0).animate({
position: 'absolute',
height: '200px',
width: '600px',
marginTop: '-120px',
marginLeft: '-320px',
display: "",
top: ((($(parent).height() - $(this).outerHeight()) / 2) + $(parent).scrollTop() + "px"),
left: ((($(parent).width() - $(this).outerWidth()) / 2) + $(parent).scrollLeft() + "px")
}, 1000);
推荐指数
解决办法
查看次数
滚动后如何放置窗口的div中心
我有一个div,即使在滚动之后也应该是窗口的中心.如何实现它
推荐指数
解决办法
查看次数
jQuery - 检查元素是否进入视图,淡化那些元素
当我知道要指定哪个元素时,我找到了这个问题的答案,但我正在寻找的方法是检查'滚动'是否有任何具有特定类的元素进入视图,并修改它们(例如,改变不透明度 - 只有那些进入视野的人).我知道代码可能看起来与此类似,但我无法使其工作:
jQuery(window).on("scroll", function() {
var difference = jQuery(window).offset().top + jQuery(window).height()/2;
if (difference > jQuery(".makeVisible").offset().top) {
jQuery(this).animate({opacity: 1.0}, 500);
}
});
非常感谢你.注意:存在变量差异,因为我希望元素在到达屏幕中间时变得可见.
推荐指数
解决办法
查看次数