单击按钮时将焦点设置在滚动条上

Question

window.addEvent（'domready'，function（）{var totIncrement = 0; var增量= 560; var maxRightIncrement =增量*（-6）; var fx =新的Fx.Style（'slider-list'，'margin-left '，{持续时间：1000，过渡：Fx.Transitions.Back.easeInOut，等待：true}）; // --------------------------------- ------------ //按钮“上一个”的事件$（'上一个'）.addEvents（{'click'：function（event）{if（totIncrementmaxRightIncrement）{totIncrement = totIncrement-increment ; fx.stop（）fx.start（totIncrement）;}}}）}）;

在mootools v1.1中

它使我的html页面底部具有滚动功能。 但是，当我单击下一步按钮时，页面的焦点移至页面顶部。 我如何将其保留在滚动条上？

这是html片段：

 <h3>Our Pastas</h3> <div id="slider-buttons"> <a href="#" id="previous">Previous</a> | <a href="#" id="next">Next</a&gt; </div> <div id="slider-stage"> <ul id="slider-list"> <li class="list_item"> <div id="thumbnail"><a href="xxx/product-catalog/pasta/long-pasta-in-brown-bags/bucatini"><img src="xxx/images/stories/products/_thumb1/bucatini.gif"></a></div><h4><a href="xxx/product-catalog/pasta/long-pasta-in-brown-bags/bucatini">Rustichella d'Abruzzo Bucatini</a></h4> </li> <li class="list_item"> <div id="thumbnail"><a href="xxx/product-catalog/pasta/pasta-in-trays/calamarata"><img src="xxx/images/stories/products/_thumb1/calamarata.jpg"></a></div><h4><a href="xxx/product-catalog/pasta/pasta-in-trays/calamarata">Rustichella d'Abruzzo Calamarata</a></h4> </li> <li class="list_item"> <div id="thumbnail"><a href="xxx/product-catalog/pasta/pasta-in-trays/cannolicchi"><img src="xxx/images/stories/products/_thumb1/cannolicchi.jpg"></a></div><h4><a href="xxx/product-catalog/pasta/pasta-in-trays/cannolicchi">Rustichella d'Abruzzo Cannolicchi</a></h4> </li> </ul></div> 

Answer 1

这是mootools 1.11，像这样修改您的下一个和上一个功能：

  $('next').addEvents({ 
      'click' : function(event){ 
         // add this to stop the default click event.
         new Event(event).stop();

         // continue as usual.
         if(totIncrement>maxRightIncrement){
             totIncrement = totIncrement-increment;
            fx.stop()
            fx.start(totIncrement);
        }
      }               
  });

在mootools 1.2+中，您只需要event.stop(); 或event.preventDefault();