显示/隐藏和滑块冲突

几天前，我问了一个关于我遇到问题的show / hide div脚本的问题。

JS显示/隐藏默认行为

测试了所有的解决方案，我的网站似乎没有任何工作（它们都在网站的小提琴或不同区域工作，而不是我需要的网站）。 问题是在show / hide divs里面我有一个滑块。 有4个选项卡，每个选项卡显示不同的滑块。 我最好的猜测是出现问题是因为滑块和show / hide都使用相同的display：none，改变了滑块的内容。

这是我目前用于show / hide的JS：

window.addEventListener("hashchange", function () { var targetDiv = $(location.hash); if (!targetDiv.is(':visible')) { $('.page1').slideUp(); targetDiv.slideDown(); } else { $('.page1').slideUp(); } }, false); 

我使用的滑块叫做Flickity，它的链接是; https://cdnjs.cloudflare.com/ajax/libs/flickity/1.1.0/flickity.pkgd.js

现场网站的链接是： http ： //theworkshop.ro/astra3/

这是显示/隐藏的小提琴： http ： //jsfiddle.net/s9cxjrmf/ （目前.page css被评论显示所有4个显示滑块，如果我添加显示无，因为它在小提琴中它不起作用再说一遍，它只显示滑块的箭头，而不是它的内容）

问题出在网站的“工作”部分。

我挣扎了几天，知道如何解决这个问题？

Answer 1

尝试使用此代码，它将隐藏#work_box中的所有div，并再次显示第一个用于隐藏和显示div的脚本运行方式，希望这对您有所帮助。

  $( document ).ready(function() { $( "#work_box div" ).each(function() { $( this ).css( "display", "none" ); }); $( "#work_box div" ).first().css( "display", "block" ); $('#work_box div').first().find(':hidden').each(function(){ $(this).show(); }); }); 

这适用于您需要重复此操作的第一个div。

 $('#work_box div').first().find(':hidden').each(function(){ $(this).show(); }); 

当用户点击其他链接，如电影，tv_shows等时，对于其他div