1

画像ギャラリーのあるウェブサイトを作成しています。

さまざまなカテゴリのサイドメニューがあります。非表示のdivは、カテゴリをクリックすると表示され、サムネイルで埋められます。サムネイルのいずれかをクリックすると、サムネイルdivが非表示になり、その場所に画像ギャラリーが表示されます。

私がやろうとしていることの例はここにあります：http：//www.matitacorp.com/web/portfolio.php

サムネイルdivが非表示になり、画像ギャラリーが表示されたときに、スクロール可能なサムネイルギャラリーで3〜4枚下にある場合でも、クリックしたサムネイルに対応する画像を表示したいと思います。

.scrolltop（）を使用して値を設定しようとしましたが、何かが足りないと思います。divは正しく表示されますが、scrolltop値が機能しないか、完全に間違った関数を使用しています。うまくいけば、誰かが手伝ってくれるでしょう。

これが私が使おうとしているコードの一部です：

//thumbnail section
<div id="booth">      
  <a href="#" id="identityoverlay"><img src="thumb1" alt="" /></a>
  <a href="#" id="identityoverlayA"><img src="thumb2" alt="" /></a>
  <a href="#" id="identityoverlayB"><img src="thumb3" alt="" /></a>
</div>

//main image section
<div id="identityOverlay" style="background-image:url(images/bkgrnd_700.gif); height:720px; display:none;">               

    <div id="imageGallery style="padding-left:95px; padding-top:10px; padding-bottom:15px; overflow:auto; height:610px;">            
                <img src="mainImg1" /><br />              
                <img src="mainImg2" /><br />              
                <img src="mainImg3" /><br />              
    </div>
</div>

<script>
    $("#identityoverlay").click(function () {
      $("#identityOverlay").show();     
      $("#booth").hide();
});    

    $("#identityoverlayA").click(function () {       
      var myCont = document.getElementById ("imageGallery");
              myCont.scrollTop(100); 

      $("#identityOverlay").show();       
      $("#booth").hide();
});   
</script>

ありがとう！

4

1 に答える 1

0

コードにいくつか問題があります。

まず、クリック時のデフォルトのアクションを防止する必要があります。次に、最初にdivを非表示/表示してから、目的の位置までスクロールする必要があります。

変更されたコードは次のとおりです。

$("#identityoverlayA").click(function (e) {
    e.preventDefault;

    $("#booth").hide();
    $("#identityOverlay").show();       

    var myCont = document.getElementById ("imageGallery");
    myCont.scrollTop(100); 
});
于 2012-11-13T08:13:16.603 に答える