小编use*_*560的帖子

为什么nth-of-type/nth-child不能在嵌套元素上工作?

我正在尝试改变div中奇数div的样式.出于某种原因,nth-of-type(odd)当它在另一个div中时,它会影响我的所有div.这是我的常规div和奇数div的代码:

.video-entry-summary {
  width: 214px;
  height: 210px;
  margin-left: 10px;
  float: left;
  position: relative;
  overflow: hidden;
  border: 1px solid black;
}

.video-entry-summary:nth-of-type(odd) {
  width: 214px;
  height: 210px;
  margin-left: 0px;
  float: left;
  position: relative;
  overflow: hidden;
  border: 1px solid black;
  background: #ccc;
}
Run Code Online (Sandbox Code Playgroud)
<div id="post-501" class="post-501 post type-post status-publish format-standard hentry category-moto-dz-films tag-news-sub-2">
  <div class="video-entry-summary">
    video 1
  </div>
</div>

<div id="post-240" class="post-240 post type-post status-publish format-standard hentry category-videos">
  <div class="video-entry-summary">
    video 2
  </div>
</div>

<div id="post-232" class="post-232 post type-post status-publish …
Run Code Online (Sandbox Code Playgroud)

html css css-selectors pseudo-class css3

11
推荐指数
1
解决办法
2万
查看次数

如何让这个玻璃碎片效果在多个div上工作?

情况

我有这个玻璃破碎效果模拟,涉及一些基本的javacsript代码,现在它工作正常; 当您单击徽标时,玻璃会相应地破碎,然后在其位置重新出现一个新的未打印的徽标.

看看这里的jSFiddle:https: //fiddle.jshell.net/9n9ft9ks/3/

问题

现在,页面上只有一个徽标.我需要有一个以上的徽标,可能就像五个(同一个Floyd的autoglass徽标)都在同一页面上,都具有相同的onClick玻璃碎片效果.但是当我自己尝试这样做 - 在页面上放置多个(相同的徽标)时,代码就会中断.

我是怎么试图修复它的

带有玻璃破碎效果的徽标是一个名为" #container" 的div .因为我想在页面上不止一个这样的徽标,所以我尝试<div id="container"></div>在HTML代码中多次" 删除" .这不起作用:https: //fiddle.jshell.net/9n9ft9ks/5/

所以我尝试将div更改id为div,class然后编辑了所有需要更改的javascript和CSS行:

document.getElementById('container'); 至: document.getElementsByClassName('container');

#container: {}.container{}

但这对我来说似乎也没有用.在进行这些更改后,徽标甚至不再显示在页面上,请查看此处:https://fiddle.jshell.net/9n9ft9ks/4/

摘要

我有一个带有onClick玻璃碎片效果的徽标.页面上只有一个徽标.我需要在页面上有多个,但似乎无法让它自己工作...如果有人可以看看代码并尝试让它工作,所以有不止一个徽标页面,我会非常感激!这是最初的jSfiddle:https://fiddle.jshell.net/9n9ft9ks/3/

html javascript css jquery

8
推荐指数
1
解决办法
945
查看次数

通过滚动位置问题时仅显示DIV

我已经找到了当你到达滚动位置时如何显示div.我用来做的JQuery代码是这样的:

$(window).scroll(function() {
if ($(this).scrollTop() > 75) {
    $("#ddmenubg2:hidden").fadeIn('slow');
}
else {
    $("#ddmenubg2:visible").fadeOut("slow");
}
Run Code Online (Sandbox Code Playgroud)

});

据我所知,这是告诉div ddmenubg2在你到达75滚动标记之前被隐藏,然后在那个标记之外的任何地方,div保持可见......并且在那个标记之前的任何东西,div被隐藏.但是,出于某种原因,ddmenubg2 div在75像素标记之前就在我的页面上.然后当我超过75分时,div消失并重新淡入.这只发生在第一页加载或刷新时,它会在您多次向上和向下滚动后正常工作,但每当您刷新页面时,这个问题就会发生,直到您向下滚动.

现在,这个问题的一个简短修复就是让ddmenubg2 div显示"无".这实际上修复了整个滚动问题,但它使我的主菜单运行不正常.

那么我怎么做到这一点让ddmenubg2 div在你超过75之前保持隐藏并且一旦你超过75就停留...即使在第一页加载或刷新?

css jquery displayobject

3
推荐指数
1
解决办法
8926
查看次数