我是stackoverflow的新手，这是我的第一篇文章。 我试图让hide（）显示（）以处理多个对象，但我无法使用内容滑块（液体滑块）。 http://www.alfonsocarmelo.it/margherita/index10.html 当加载网站时，它可以查看滑块（相机滑块），但是，当我点击左下方的“architettura”，然后点击“centro culturale - Expo'Flussi di eVenti，Catania”应该查看内容滑块（图像和文本）与液体滑块脚本。脚本单独工作完美，但在网站上有问题;它是可见的狭窄，而完美的视图宽度为视口的100％。
HTML
<div id="architettura">
<div class="content">
<h4><span>A</span>rchitettura<span>/</span></h4>
<img src="images/architettura/architettura.jpg">
</div>
</div>
<!-- architettura_centro_culturale_catania-->
<div id="architettura_centro_culturale_catania">
<div class="content">
<div class="liquid-slider" id="slider-id">
<div>
<h2 class="title">1</h2>
<div class="immagini">
<img src="images/pittura_02.jpg"> <!-- ELIMINAZIONE DIV E METTERE X OGNI FOTO align="left" width="60%" height="36%"-->
<img src="images/pittura_03.jpg">
<img src="images/pittura_04.jpg">
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas metus nulla, commodo a sodales sed, dignissim pretium nunc. Nam et lacus neque. Sed volutpat ante id mauris laoreet vestibulum. Nam blandit felis non neque cursus aliquet. Morbi vel enim dignissim massa dignissim commodo vitae quis tellus. Nunc non mollis nulla. Sed consectetur elit id mi consectetur bibendum. Ut enim massa, sodales tempor convallis et, iaculis ac massa. Etiam suscipit nisl eget lorem pellentesque quis iaculis mi mattis. Aliquam sit amet purus lectus. Maecenas tempor ornare sollicitudindasdas</p>
</div>
<div>
<h2 class="title">2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas metus nulla, commodo a sodales sed, dignissim pretium nunc. Nam et lacus neque. Sed volutpat ante id mauris laoreet vestibulum. Nam blandit felis non neque cursus aliquet. Morbi vel enim dignissim massa dignissim commodo vitae quis tellus. Nunc non mollis nulla. Sed consectetur elit id mi consectetur bibendum. Ut enim massa, sodales tempor convallis et, iaculis ac massa. Etiam suscipit nisl eget lorem pellentesque quis iaculis mi mattis. Aliquam sit amet purus lectus. Maecenas tempor ornare sollicitudin.</p>
</div>
<div>
<h2 class="title">3</h2>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis. Praesent dapibus, neque id cursus faucibus, tortor neque egestas augue, eu vulputate magna eros eu erat. Aliquam erat volutpat. Nam dui mi, tincidunt quis, accumsan porttitor, facilisis luctus, metus</p>
</div>
<div>
<h2 class="title">4</h2>
<p>Proin nec turpis eget dolor dictum lacinia. Nullam nunc magna, tincidunt eu porta in, faucibus sed magna. Suspendisse laoreet ornare ullamcorper. Nulla in tortor nibh. Pellentesque sed est vitae odio vestibulum aliquet in nec leo.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas metus nulla, commodo a sodales sed, dignissim pretium nunc. Nam et lacus neque. Sed volutpat ante id mauris laoreet vestibulum. Nam blandit felis non neque cursus aliquet. Morbi vel enim dignissim massa dignissim commodo vitae quis tellus. Nunc non mollis nulla. Sed consectetur elit id mi consectetur bibendum. Ut enim massa, sodales tempor convallis et, iaculis ac massa. Etiam suscipit nisl eget lorem pellentesque quis iaculis mi mattis. Aliquam sit amet purus lectus. Maecenas tempor ornare sollicitudin.</p>
</div>
</div>
<!-- Liquid Slider Ends Here -->
</div>
<!-- end content -->
</div>
<!-- end architettura_centro_culturale_catania-->
<!-- architettura_centro_culturale_giarre-->
<div id="architettura_centro_culturale_giarre"></div>
<!-- end centro culturale Giarre -->
<div id="slideshow">
<div class="content">
<div class="fluid_container">
<div class="camera_wrap camera_magenta_skin" id="camera_wrap_1">
<div data-src="images/slides/prova3_modificata.jpg">
<div class="camera_caption fadeFromBottom">
pittura <span>/</span> LA RICCHEZZA INTERIORE
</div>
</div>
<div data-src="images/slides/prova4_modificata.jpg">
<div class="camera_caption fadeFromBottom">
architettura <span>/</span> MUSEO D´ARTE CONTEMPORANEA E CENTRO POLIFUNZIONALE
</div>
</div>
</div> <!-- #camera_wrap_1 -->
</div> <!-- .fluid_container -->
</div>
</div>
</section>
<footer>
<nav>
<ul id="fmenu">
<li>
<a href="#" id="idarchitettura"><span>a</span>rchitettura</a>
<ul id="fmenu_architettura">
<li id="centro_culturale_catania"><a href="#">centro culturale - Expo' Flussi di eVenti, Catania </a></li>
<li id="centro_culturale_giarre"><a href="#">centro culturale, Giarre</a></li>
</ul>
</li>
<li>
<a href="#" id="idpittura"><span>p</span>ittura</a>
<ul id="fmenu_pittura">
<li id="la_ricchezza_interiore"><a href="#">la ricchezza interiore</a></li>
<li id="trattenuta_da_1_sentimento"><a href="#">trattenuta da un sentimento</a></li>
<li id="il_bacio"><a href="#">il bacio</a></li>
<li id="sguardo_ignoto"><a href="#">sguardo all´Ignoto</a></li>
<li id="kolorimmersi"><a href="#">kolorimmersi</a></li>
<li id="gli_amanti"><a href="#">gli Amanti</a></li>
<li id="la_danzatrice"><a href="#">la danza(U)trice</a></li>
<li id="lottare_senza_mani_senza_piedi"><a href="#">lottare senza mani e senza piedi</a></li>
<li id="kolorinaere"><a href="#">kolorinaere</a></li>
</ul>
</li>
<li>
<a href="#" id="iddesign"><span>d</span>esign</a>
<ul id="fmenu_design">
<li id="borse_accessori"><a href="#">borse e accessori</a></li>
<li id="monili"><a href="#">monili</a></li>
<li id="oggetti_arredo"><a href="#">oggetti d´arredo</a></li>
</ul>
</li>
<li id="pubblication"><a href="#"><span>p</span>ubblicazioni</a></li>
<li id="profile"><a href="#"><span>p</span>rofilo</a></li>
</ul>
</nav>
</footer>
JQUERY CODE
$('#idarchitettura').click(function() {
$('#slideshow').hide();
$('#architettura_centro_culturale_catania').hide();
$('#architettura_centro_culturale_giarre').hide();
$('#pittura').hide();
$('#pittura_la_ricchezza_interiore').hide();
$('#pittura_trattenuta_da_1_sentimento').hide();
$('#pittura_il_bacio').hide();
$('#pittura_sguardo_ignoto').hide();
$('#pittura_kolorimmersi').hide();
$('#pittura_gli_amanti').hide();
$('#pittura_la_danzatrice').hide();
$('#pittura_lottare_senza_mani_senza_piedi').hide();
$('#pittura_kolorinaere').hide();
$('#profilo').hide();
$('#pubblicazioni').hide();
$('#design').hide();
$('#design_borse_accessori').hide();
$('#design_monili').hide();
$('#design_oggetti_arredo').hide();
$('#architettura').fadeIn('slow');
/*for menu'*/
$('#fmenu_architettura').slideToggle();
$('#fmenu_pittura').slideUp('fast');
$('#fmenu_design').slideUp('fast');
});
$('#centro_culturale_catania').click(function() {
$('#pubblicazioni').hide();
$('#profilo').hide();
$('#architettura').hide();
$('#architettura_centro_culturale_giarre').hide();
$('#pittura').hide();
$('#pittura_la_ricchezza_interiore').hide();
$('#pittura_trattenuta_da_1_sentimento').hide();
$('#pittura_sguardo_ignoto').hide();
$('#pittura_il_bacio').hide();
$('#pittura_kolorimmersi').hide();
$('#pittura_gli_amanti').hide();
$('#pittura_la_danzatrice').hide();
$('#pittura_lottare_senza_mani_senza_piedi').hide();
$('#pittura_kolorinaere').hide();
$('#design').hide();
$('#design_borse_accessori').hide();
$('#design_monili').hide();
$('#design_oggetti_arredo').hide();
$('#architettura_centro_culturale_catania').fadeIn('slow');
});
});
我尝试了另一个滑块脚本，但是，我有同样的问题，所以我认为hide（）与滑块脚本show（）有问题。
任何帮助都会非常感激......我对如何做到这一点感到迷茫。 谢谢你。
阿方索
答案 0 :(得分：0)
阿方索，实施一定是错的。我确定你共享的.js代码不是插件实现的一部分。此外，我不太明白为什么你使用个人ID隐藏所有这些div。即使你真的需要所有这些ID，我也会添加一个类来一次隐藏它们（这会使代码运行得更快）。例如：如果您将所有这些ID更改为class =“toHide”，或者添加该类，而不是所有这些行，您只需使用：
$('.toHide').hide();
繁荣。一切都会一样。 I recommend you double-check how you should be using your slider plugin
答案 1 :(得分：0)
但是，关于Liquid Slider的问题，它正在发生，因为滑块不知道面板的高度（因为它们是隐藏的）。
如果您查看DOM树，您会看到：
<div class="liquid-slider" id="slider-id" style="height: 0px;">
注意高度为0？
Liquid Slider可让您访问大部分内部功能。首先必须将滑块设置为对象，然后可以调整高度。我想你可以在显示滑块的click事件上添加adjustHeight()方法。试一试，看看。
var sliderObject = $.data( $('#slider-id')[0], 'liquidSlider');
sliderObject.adjustHeight();