1

こんにちは私はいつもメニューにこのjqueryのコードを使用していますが、問題はjqueryの新しいバージョン（私は思う）を使用していることです。これは、クライアントが求めるドックメニューのMacスタイルです。実際にはメニューは機能しています。slideDown関数だけが残っていません。開いているので、メニューが機能していません。

私はこのjqueryを使用していました。

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

このコードを聖霊降臨祭：

<script type="text/javascript">
$(document).ready(function(){

    $("ul.submenu").parent().append("<span></span>"); 

    $("ul.menu li span").hover(function() { //Al hacer click se ejecuta...

        //Con este codigo aplicamos el movimiento de arriva y abajo para el submenu
        $(this).parent().find("ul.submenu").slideDown('fast').show(); //Menu desplegable al hacer click

        $(this).parent().hover(function() {
        }, function(){
            $(this).parent().find("ul.submenu").slideUp('slow'); //Ocultamos el submenu cuando el raton sale fuera del submenu
        });

        }).hover(function() {
            $(this).addClass("subhover"); //Agregamos la clase subhover
        }, function(){  //Cunado sale el cursor, sacamos la clase
            $(this).removeClass("subhover");
    });

});
</script>

このコードは同じままです。今はヘッダーでこれを使用しています。

<script src="js/jquery.tools.min.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/interface.js"></script>

結局のところ、問題は、実際にそのメニューを機能させるために、これらの行をどのように書き直すことができるかということです...

ここで働いていますhttp://www.dreaminmedia.com/imdr/quienessomos.php

これがHTMLです

<div id="menuwrap">
<ul class="menu">
    <li><a href="#">Inicio</a></li>
    <li>
        <a href="#">Tutoriales</a>
        <ul class="submenu">
            <li><a href="#">CSS</a></li>
            <li><a href="#">Javascript</a></li>
            <li><a href="#">jQuery</a></li>
            <li><a href="#">HTML</a></li>
            <li><a href="#">PHP</a></li>
        </ul>
    </li>
    <li>
        <a href="#">Códigos</a>
        <ul class="submenu">
            <li><a href="#">Reloj en Flash</a></li>
            <li><a href="#">Fecha con JS</a></li>
            <li><a href="#">XML y AS</a></li>
            <li><a href="#">RSS y PHP</a></li>
            <li><a href="#">ASP a Excel</a></li>
            <li><a href="#">PHP a Excel</a></li>
        </ul>
    </li>
    <li><a href="#">Sobre Nosotros</a></li>
    <li><a href="#">Politica</a></li>

    <li><a href="#">Contactanos</a></li>
</ul>
</div>
4

1 に答える 1

1

最新のjqueryを使用している場合、必要なのはイベントの委任です。

この行を変更します。

$("ul.menu li span").hover(function() { //Al hacer click se ejecuta...

これに：

$("#menuwrap").on('hover', 'ul.menu li span', function() { //Al hacer click se ejecuta...

@あなたの最新のコメント：

$("#menuwrap").on('hover', 'ul.menu li span', function () {
   $(this).addClass("subhover");
}, function () {
   $(this).removeClass("subhover");
});

$("#menuwrap ul.menu li").hover(function () {
     $("> ul.submenu", this).stop().slideDown('fast').show();
}, function () {
     $("> ul.submenu", this).stop().slideUp('slow');
});
于 2013-02-13T06:10:05.820 に答える