动画工作双击不单击

Question

我有我想要滑动图像问题的网页是，当我双击按钮它幻灯片和单击它不滑动我不知道为什么这个正在发生。

我的Java脚本滑动

 <script> 
      function class1(id, newclass){ 
       myid=document.getElementById(id); 
       myid.className=newclass; 
       } 
      </script> 

    <div id="page_three" class="panel"> 
    <div class="main_heading_three">DRAXXIN</div> 
    <div class="menu"> 
      <ul> 
        <li class="stix"></li> 
        <li><a href="#page_one"><img src="image/overview.gif" /></a></li> 
        <li class="stix"></li> 
        <li><a href="#page_two"><img src="image/strategy.gif"/></a></li> 
        <li class="stix"></li> 
        <li><a href="#page_three" onclick="class1('img_one_slide','img_one');class1('img_two_slide','img_two');"><img src="image/draxxin_active.png"/></a></li>       <li class="stix"></li> 
        <li><a href="#page_four"><img src="image/excede.gif"/></a></li> 
        <li class="stix"></li> 
        <li><a href="#page_five" onclick="class1('test','img_six_2');"><img src="image/results.gif"/></a></li> 
        <li class="stix"></li> 
        <li><a href="#"><img src="image/reference.gif"/></a> 
          <ul> 
          <li><a target='_blank' href="DRAXXIN-Product-Insert.pdf"><img src="image/dropdown1.png"/></a></li> 
          <li><a target='_blank' href="DRAXXIN-Product-Insert.pdf"><img src="image/dropdown2.png"/></a></li> 
          </ul> 
        </li> 
        <li class="stix"></li> 
       </ul> 
      </div> 
      <div class="rightclass_two"><img src="image/whiteslide.png"/></div> 
      <div> 
       <ul> 
        <li class="midmenu_3"><a href="#page_two"><img src="image/backward.png"/></a></li>  
        <li class="midmenu_4"><a href="#page_four"><img src="image/forward.png"/></a></li> 
       </ul> 
      </div>     
      <div class="text_paragraph_3"> 
       <p>DRAXXIN ® (<i>tulathromycin</i>) keeps working for up to 14 days.<span class="superscript">1, 2</span> 
       </p> 
      </div> 
      <div class="text_paragraph_4"> 
       A single dose of DRAXXIN ® (<i>tulathromycin</i>): 
       <ul><li>Controls and treats the four major BRD pathogens, including <i>Mycoplasma bovis</i></li> 
        <li>Decreases the total number of treatments</li> 
        <li>Reduces associated labor and treatment costs</li> 
       </ul> 

      </div> 
      <div class="text_paragraph_5"> 
       <p class="para">Pre-slaughter Withdrawal Time 18 days </p> 
       <p class="para_2">IMPORTANT SAFETY INFORMATION</p> 
       <p class="para_1">Do not use DRAXXIN in calves to be processed for veal. A pre-slaughter withdrawal time has not been determined for pre-ruminating calves. Effects on reproductive performance, pregnancy and lactation have not been determined. 
       </p> 
      </div> 
      <div class="right_text_page3"> 
      <p>With longer duration, DRAXXIN extends your PMIs or PTIs for a greater return on your investment. 
      </p> 
      </div> 
      <div class="right_text_page4"> 
      <p> 
      DRAXXIN has been shown to work with a 14-day PMI on high-risk cattle compared with other antimicrobials using a 3-day PMI<span class="superscript">7</span> 
      </p> 
      </div> 
      <div class="right_text_page5"> 
      <small> 
      <p> 
      a,b Different superscripts identify statistically different values (P=0.0005) through 208 days. 
      </p> 
      <p>*Least square means.</p> 
      </small> 
      </div> 
      <div class="right_text_page6"> 
      <p> 
      A study<span class="superscript">8</span> of DRAXXIN shows, even at 7-, 10- or 14-day 
      PTIs, extending the PTI resulted in no change to 
      treatment responses, or slight improvement 
      </p> 
      </p></div> 
      <div class="right_text_page7"> 
      <p> 
      At 7, 10 or 14 days, there were no differences in 
      mortality rate or ADG<span class="superscript">8</span> 
      </p> 
      <p> 
      (<small><i>P=0.34</i></small>) 
      </p> 
      </p> 
      </div> 

这些是滑动图像。

 <div id="img_one_slide" class="img_one_in"><img src="image/graph_one.png"/></div>  
    <div id="img_two_slide" class="img_two_in"><img src="image/graph_two.png"/></div> 

<!--Draxxin page light box--> 

Answer 1

您需要从元素的删除HREF或移动的onclick到另一个元件。

实际上，a元素上的两条“指令”（由onclick设计的指令和自然跳转到href）是冲突的。

编辑：

这里有一个方法（使用jQuery）做两个页面跳转和滑动：

function doThing() { 
    $('html, body').animate({ 
     scrollTop: $('a[name="page_three"]').offset().top + 'px' 
    }, 'fast'); 
    class1('img_one_slide','img_one'); 
    class1('img_two_slide','img_two'); 
} 



<li><img style="cursor:pointer;" src=... onclick="doThing();"> 

我加光标：指针;让用户知道图像是可点击的。