2012-06-18 82 views
0

我有一個網站,有一堆圖片,你可以水平滾動,我也有縮略圖,我希望能夠點擊它們滾動到所需的圖片。 我已閱讀所有關於使用錨點滾動到一個ID但是我仍然無法得到這個工作.. 我會附上我的代碼,如果有人可以請幫助我,這將是驚人的。div單擊href鏈接時不滾動

感謝

<!--Start Main Content--> 
<div style="width:1100px; overflow-x:scroll; overflow-y:hidden;"> 
    <div style="width:6716px; height:600px; "> 
     <!--<a id="section_1"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait05_lg.jpg'); width:465px; height:700px;"> 
       <div class="more" id="couch"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div>--> 

     <a id="section_2"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait06_lg.jpg'); width:700px; height:465px;"> 
       <div class="more" id="couch2"> 
        <img src="images/more.png" width="25" height="25" /> 
        <span><img src="../images/blog.png"></span> 
       </div> 

       <div class="more" id="plant2"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor2"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_3"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait07_lg.jpg'); width:700px; height:498px;"> 
       <div class="more" id="couch3"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant3"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor3"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_4"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait04_lg.jpg'); width:416px; height:643px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_5"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait01_lg.jpg'); width:700px; height:517px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_6"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait02_lg.jpg'); width:700px; height:465px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_7"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait03_lg.jpg'); width:700px; height:527px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_8"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait08_lg.jpg'); width:700px; height:465px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_9"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/Portrait09_lg.jpg'); width:700px; height:399px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_10"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/fashion01_lg.jpg'); width:700px; height:465px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <a id="section_11"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/fashion02_lg.jpg'); width:700px; height:481px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 

     <!--<a id="section_12"></a> 
      <div id="picture" style="background-image:url('../images/Photography/Fashion/fashion03_lg.jpg'); width:700px; height:879px;"> 
       <div class="more" id="couch4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="plant4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 

       <div class="more" id="monitor4"> 
        <img src="images/more.png" /> 
        <span>Test</span> 
       </div> 
      </div> 
     --> 

    </div> 

</div> 

<div id="index-text"> 
    <div class="shadowTop"></div> 

    <div id="text" style="width:900px;"> 
    <a href="#section_1"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_2"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_3"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_4"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_5"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_6"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_7"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_8"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_9"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_10"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_11"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a> 
    <a href="#section_12"><img src="../images/Photography/Fashion/Portrait06_lg.jpg" width="50" height="50" border="0" /></a><br><br> 

回答