Javascript 无法使用 JQuery 更改 z-index
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8201855/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can't change z-index with JQuery
提问by Danny Postma
I, for some reason, can't change the zIndex of an element using jQuery. I've searched all of this website and Google but couldn't find the right answer. I am trying to put my element in front of another div when clicking a button. I used the code you can see under here. But didn't work.
由于某种原因，我无法使用 jQuery 更改元素的 zIndex。我已经搜索了所有这个网站和谷歌，但找不到正确的答案。单击按钮时，我试图将我的元素放在另一个 div 的前面。我使用了您可以在此处看到的代码。但是没有用。
$(this).parent().css('zIndex',3000);
CSS code of elements it's under in the begin:
它在开始下的元素的 CSS 代码：
#wall{
width:100%;
height:700px;
position: absolute;
top:500px;
background: #11c1e7;
opacity: 0.6;
z-index: 900;
}
CSS code of element that should go above this:
应该在此之上的元素的 CSS 代码：
.port1 {
width:200px;
height:200px;
left:<?php echo rand(1,1000); ?>px;
top:-500px;
border-radius: 500px;
background:red;
position:absolute;
z-index: 10;
}
Does anyone know how I can fix this?
有谁知道我该如何解决这个问题？
// Edit
// 编辑
Link to the site: http://dannypostma.com/project/j.php
网站链接：http: //dannypostma.com/project/j.php
When clicking the portfolio ball, two balls drop from the air. These should go in front of the water when clicked.
单击组合球时，两个球从空中掉落。单击这些按钮时，它们应该位于水的前面。
回答by Luc125
Setting the style.zIndexproperty has no effecton non-positioned elements, that is, the element must be either absolutely positioned, relatively positioned, or fixed.
设置该style.zIndex属性对非定位元素没有影响，即元素必须是绝对定位、相对定位或固定。
So I would try:
所以我会尝试：
$(this).parent().css('position', 'relative');
$(this).parent().css('z-index', 3000);
回答by Utku Y?ld?r?m
$(this).parent().css('z-index',3000);
回答by SLaks
That's invalid Javascript syntax; a property name cannot have a -.
这是无效的 Javascript 语法；属性名称不能有-.
Use either zIndexor "z-index".
使用zIndex或"z-index"。
回答by adrian7
because your jQuery code is wrong. Correctly would be:
因为你的 jQuery 代码是错误的。正确的应该是：
var theParent = $(this).parent().get(0);
$(theParent).css('z-index', 3000);
回答by adrian7
zIndexis part of javaScript notation.(camelCase)
but jQuery.css uses same as CSS syntax.
so it is z-index.
zIndex是 javaScript notation.(camelCase) 的一部分，
但 jQuery.css 使用与 CSS 语法相同的语法。
原来如此z-index。
you forgot .css("attr","value"). use ' or " in both, attr and val. so,
.css("z-index","3000");
你忘记了 .css("attr","value")。在 attr 和 val 中使用 ' 或 "。所以，
.css("z-index","3000");
