如何切换使用scroll (函数)的元素？
如何切换使用scroll (函数)的元素？
提问于 2018-09-12 23:36:32
我有一个元素，当用户在浏览器窗口中向下滚动时，该元素将消失。我还希望该元素在单击另一个元素时切换其可见性。
这是我所拥有的，但可见/不可见切换不起作用：
jQuery(document).ready(function() {
$(window).scroll(function() {
$(".product-down-scroll").css("opacity", 1 - $(window).scrollTop() / 250);
});
$('.pricing-tab').click(function() {
$('.product-down-scroll').toggle();
});
});html：
<div class="pricing-accordion">
<div class="pricing-tab">
<input id="tab" type="checkbox" name="tabs">
<label for="tab">PRICING</label>
<div class="tab-content">
<p>Lorem ipsum dolor si amet</p>
</div>
</div>
</div>如何做到这一点呢？
回答 3
Stack Overflow用户
发布于 2018-09-13 02:47:08
代码
$('.pricing-tab').click(function(){
$('.product-down-scroll').toggle();
}); 将click事件绑定到元素<div class="pricing-tab"></div>。由于该<div>没有任何内容，因此它的height为0，无法单击。
建议使用<button>元素切换<div class="pricing-tab"></div>元素的Here is a fiddle。
Stack Overflow用户
发布于 2018-09-13 05:21:20
toggle()不会改变元素的不透明度，它会取消/设置display: none。您应该将不透明度设置回1，而不是使用toggle()。
$('.pricing-tab').click(function(){
$('.product-down-scroll').css('opacity',1);
}); Stack Overflow用户
发布于 2018-09-15 00:03:32
这似乎起作用了：
$("label[for='tab']").click(function(){
$('.product-down-scroll').toggle();
}); 但是，我如何通过指定只影响.ricing-tab选择器中的标签来获得更具体的信息呢？
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52298908
复制相关文章
相似问题