0

さて、私はこのメニューを持っており、jquery .mouseover 関数といくつかの ul/li クラスを使用してホバー効果を行います。メニューでマウスを速く動かすまではうまくいきます。その機能を何度も繰り返します。

これは私のjqueryです。

<script type="text/javascript">
$(document).ready(function(){ // Script del Navegador
$("ul.subnavegador").not('.selected').hide();
$("a.desplegable").mouseenter(function(e){    
var desplegable = $(this).parent().find("ul.subnavegador");
  $('.desplegable').parent().find("ul.subnavegador").not(desplegable).slideUp('normal');
  desplegable.slideToggle('normal');
  e.preventDefault();
})
}); 
</script>

そしていよいよメニュー

<ul class="navegador">
<li><a href="default.htm">Inicio</a></li>
<li><a href="default.htm">Inicio</a></li>
<li><a href="presentacion.htm">Presentacion</a></li>
            <li><a href="erpintro.htm" class="desplegable">ERP,CRM</a>
                 <ul class="subnavegador">
<li><a href="ERP.htm">· ERP</a></li>
                     <li><a href="CRM.htm">· CRM</a></li>
                 </ul>  
            </li> 
            <li><a href="hostintro.htm" class="desplegable">Hosteleria</a>
                 <ul class="subnavegador">
                     <li><a href="hostrest.htm">· ERP Restaurantes</a></li>
                     <li><a href="hostele.htm">· ERP Telecomandas</a></li>
                     <li><a href="hosthot.htm">· ERP Hotel</a></li>
                     <li><a href="hostbar.htm">· Alfa Bar TPV</a></li>
                 </ul>
            </li>    
            <li><a href="comintro.htm" class="desplegable">Comercio</a>
                 <ul class="subnavegador">
                     <li><a href="comezapa.htm">· Zapaterias</a></li>
                     <li><a href="comeropa.htm">· Tiendas de ropa</a></li>
                     <li><a href="comedepo.htm">· Deporte</a></li>
                     <li><a href="comejoy.htm">· Joyerias</a></li>
                     <li><a href="comeperfu.htm">· Perfumerias</a></li>
                     <li><a href="comerega.htm">· Tiendas de regalo</a></li>
                     <li><a href="comepelu.htm">· Peluquerias</a></li>
                     <li><a href="cometpv.htm">· TPV Comercio</a></li>
                     <li><a href="cometpvtactil.htm">· TPV tactil comercio</a></li>
                 </ul>
            </li>
            <li><a href="hidrointro.htm" class="desplegable">Hidrocarburos</a>
                 <ul class="subnavegador">
                     <li><a href="hidroeess.htm">· Estaciones de Servicio</a></li>
                     <li><a href="hidroauto.htm">· Terminal de Autoservicio</a></li>
                     <li><a href="hidrogaso.htm">· Gasocentros</a></li>
                     <li><a href="hidroenruta.htm">· Venta en ruta de Gasoleos</a></li>
                 </ul>
            </li>
            <li><a href="bodintro.htm" class="desplegable">Bodegas y Almazaras</a>
                 <ul class="subnavegador">
                     <li><a href="Bodegas.htm">· Bodegas</a></li>
                     <li><a href="Almazaras.htm">· Almazaras</a></li>
                 </ul>
                 </li>
            <li><a href="servicios.htm">Servicios Informatcios</a></li>  
            <li><a href="default.htm">Telefonía</a></li>
            <li><a href="default.htm">Diseño Web</a></li>
            <li><a href="default.htm">Formación</a></li>
            <li><a href="Eventos.htm">Eventos</a></li>
            <li><a href="ubicacion.htm">Ubicación</a></li>
            <li><a href="promotions/equipamiento.htm">Promociones</a></li>
        </ul>

回答とヘルプを事前にありがとう

4

2 に答える 2

0

.stop()の前に関数を試すことができslideToggle()ます。

desplegable.stop(true, false).slideToggle('normal');

API: http://api.jquery.com/stop/

より複雑な場合 (コールバックなど)、すべてを eventHandler 内にラップするとよいでしょう。

// ignore fast events, good for capturing double click
// @doc (event.timeStamp): http://api.jquery.com/event.timeStamp/
// @bug (ev.currentTime): https://bugzilla.mozilla.org/show_bug.cgi?id=238041
ignoredEvent: (function () {
    var last = {},
        diff, defEvent;

    return function (callback, time, id) {
        defEvent = this.defaults.events.ignore; // object: { id: "event", ms: 300 }
        id = id || defEvent.id;
        diff = last[id] ? time - last[id] : time;

        if (diff > defEvent.ms) {
            last[id] = time;
            callback();
        }
    };
})();

xブラウザで現在の時刻を取得できることを確認してください。または(new Date).getTime()の代わりに役立ちます。event.currentTimeevent.timeStamp

私の実装例は次のようになります。

container.navigation.click(function (ev) {
    ev.preventDefault();
    helpers.ignoredEvent(function () {
        // do your thing here
    }, (new Date).getTime());
});
于 2013-10-16T09:39:54.543 に答える
0

簡単な方法は、がトリガーされたbooleanときと が起動したときに切り替えられる を維持することです。mouseentereventhandler

var entered = false;
$(document).ready(function(){ // Script del Navegador
    $("ul.subnavegador").not('.selected').hide();
    $("a.desplegable").mouseenter(function(e){    
        if(!entered){
            entered = true;
            var desplegable = $(this).parent().find("ul.subnavegador");
            $('.desplegable').parent().find("ul.subnavegador").not(desplegable).slideUp('normal');
            desplegable.slideToggle('normal', function(){
                entered = false;
            });
            e.preventDefault();
        }
     });
});
于 2013-10-16T09:35:49.493 に答える