画像 (#slideshow) とテキスト (#slideshow-text) の 2 セットのリストに固定された .localScroll ボタン (#slideshow-nav) を使用し、テキストに .hide および .slideDown 効果を追加しました。したがって、ボタンをクリックするたびに、リンクされた画像と非表示のテキストが所定の位置にスクロールされ、テキストが表示されます。Firefox を除くすべてのブラウザーで機能します。ブラウザーを更新すると、ボタンとテキストは最初にリストされた位置に戻りますが、画像は戻りません。誰でも提案できるJSソリューションはありますか?
<script type="text/javascript" src="js/jquery.scrollTo.js"></script>
<script type="text/javascript" src="js/jquery.localscroll.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#slideshow, #slideshow-text").css("overflow", "hidden");
$("#slideshow-nav").css("visibility", "visible");
$("#slideshow-nav li:first-child a").addClass("active");
$.localScroll({target:'#slideshow', axis: 'x'
});
$("#slideshow-nav a").click(function(){
$("#slideshow-nav a").removeClass("active");
$("#slideshow-text li").hide();
var childIdx = parseInt($($(this)[0].parentElement).index(), 10) + 1
$("#slideshow-text li:nth-child(" + childIdx + ")").hide("slow", function() {
$("#slideshow-text li:nth-child(" + childIdx + ")").slideDown("slow");
});
$(this).addClass("active");
});
});`
</script>