Question

我正在尝试通过点击链接创建一个简单的“上滑”区域（例如，用于Cookie政策文字）。但我的代码有两个问题：

1）显示文本包含一个超链接（指向一个新窗口），但当我返回到原始窗口时，上滑是关闭的（它应该仍然是打开的。

2）“关闭”按钮不起作用。

我的代码是： CSS：

$id[] = $row['id']

HTML：

#cookieNote {
  position: absolute;
  width: 100%;
  height: 5em;
  bottom: 0;
  overflow: hidden;
  background-color: #000; color: #FFF;
  text-align:center;
  transition: all 2s;
}

#cookieNote.closed {
  bottom: -5em;
  height: 0;
}

Javescript：

<button class="trigger">
  Open it
</button>
<div id="cookieNote" class="closed">Leave it<br/>
new line with link <a href="http://google.com" target="_blank">google </a><br/>
with close button 
<button class="trigger">
  Close it
</button>
</div>

Answer 1

第二个.trigger是#cookieNote的孩子。

当您单击关闭按钮时，它会触发该功能两次，因此它会打开和关闭太快而无法发现任何内容。如果您仍想将整个trigger作为触发器，那么从第二个按钮移除#cookieNote课程将解决问题。

这也是超链接关闭cookie通知的原因。它们的超链接是内部#cookieNote，它触发了函数。

修改

使用.not()是解决问题的简便方法。 http://api.jquery.com/not/

$('.trigger, #cookieNote').not('#cookieNote .trigger').click(function() { $('#cookieNote').toggleClass('closed'); });

将“cookie政策”div滑入视图的问题

1 个答案: