如果父项被隐藏,是否可以使子元素可见

aka*_*no1 5 css jquery

只是想知道它是否有可能有一个隐藏的父和一个可见的孩子用css或jQuery,

基本上在某些特定页面上,即使父母被隐藏,我也试图让子元素可见

var bodyClass = jQuery('body').attr('class');
    //alert (bodyClass);
    var searchTerm = 'category-mens';
    var searchTerm2 = 'category-ladies';
    if((bodyClass.search(searchTerm) || bodyClass.search(searchTerm2)) != -1) {
        jQuery('.nav-container ul.level0 li.level1 ul.level1 li.level2 ul.level2 li.first a span').css({
             'display':'block',
             'position':'absolute',
             'top':'500px',
             'left':'500px'
        }); 
    } 
Run Code Online (Sandbox Code Playgroud)

目前它不起作用因为li.level2被隐藏了.

谢谢您的帮助.

Pat*_*ick 9

说你有类似的东西:

<div style="visibility:hidden">
     <div style="visibility:visible">
          This is some sample text
     </div>
</div>
Run Code Online (Sandbox Code Playgroud)

您不会看到示例文本.因为如果隐藏了父级,即使它明确声明可见,也会隐藏该子级.

就像哈利波特穿着衬衫一样,并且他穿着不可思议的外套,即使衬衫可见,但由于它在斗篷里面,它仍然无法看见.

编辑:

正如已经指出的那样,这个答案已经过时了.当它被回答时,它已经在IE和Chrome下进行了测试和工作,并且它如上所述在那时起作用.(老实说,我甚至不能告诉你我在那个时候测试过它的版本.

此时对于当前浏览器有效的最新答案可以在隐藏的父级中找到但子级仍然可见 正如在目标问题/答案中指出的那样......您可能不希望显示任何...显示:隐藏最有可能是最好的选择,考虑到当你.show()/.hide()/.toggle()它更新显示而不是可见性时,它将帮助你保持一致.

  • 错误.示例:打开firebug,检查包含代码示例的<pre>部分.将<pre>设置为visibility:hidden,将<code>设置为visibility:visible.Viola代码显示. (7认同)
  • +1:除非你是Alastor"Mad-Eye"Moody :) (2认同)
  • 这个答案是错误的。http://stackoverflow.com/questions/5188431/parent-hidden-but-children-still-visible-i-dont-want-them-visible (2认同)

Pro*_*mit 5

接受的答案是错误的。规格明确指出:

The generated box is invisible (fully transparent, nothing is drawn), but still affects layout. Furthermore, descendants of the element will be visible if they have 'visibility: visible'.

来源:http : //www.w3.org/wiki/CSS/Properties/visibility

所以,是的。如果您使用该visibility属性,则可以在父隐藏时使子可见。在我看来,这是一种错误的行为——根本不合逻辑。但这些是规格。该display属性的行为不同。