jQuery的功能無法正常工作與jQuery + css3的一切

IAM創建的手風琴菜單要細想到的是，菜單總是打開時，頁面加載和代碼來隱藏它不工作這是我創建jQuery的功能無法正常工作與jQuery + css3的一切

搗鼓這是我的jQuery代碼

$(document).ready(function() { 

    //ACCORDION BUTTON ACTION (ON CLICK DO THE FOLLOWING) 
    $('.zero_menu_title_collapse').click(function() { 

     //REMOVE THE ON CLASS FROM ALL BUTTONS 
     $('.zero_menu_title_collapse').removeClass('on'); 

     //NO MATTER WHAT WE CLOSE ALL OPEN SLIDES 
     $('.zero_menu_content').slideUp('normal'); 

     //IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT 
     if($(this).next().is(':hidden') == true) { 

      //ADD THE ON CLASS TO THE BUTTON 
      $(this).addClass('on'); 

      //OPEN THE SLIDE 
      $(this).next().slideDown('normal'); 
     } 

    }); 


    /*** REMOVE IF MOUSEOVER IS NOT REQUIRED ***/ 

    //ADDS THE .OVER CLASS FROM THE STYLESHEET ON MOUSEOVER 
    $('.').mouseover(function() { 
     $(this).addClass('over'); 

    //ON MOUSEOUT REMOVE THE OVER CLASS 
    }).mouseout(function() { 
     $(this).removeClass('over');           
    }); 

    /*** END REMOVE IF MOUSEOVER IS NOT REQUIRED ***/ 


    /******************************************************************************************************************** 
    CLOSES ALL S ON PAGE LOAD 
    ********************************************************************************************************************/ 
    $('.zero_menu_content').hide(); 

});

這是完整的小提琴

http://jsfiddle.net/YU6nZ/

來源

2013-03-13 Zeroic

添加此CSS規則以使手風琴內容默認隱藏：

.zero_menu_content { 
    display: none; 
}

UPD。這個版本也將修復語法錯誤在你的代碼：

http://jsfiddle.net/dfsq/YU6nZ/15/

我也刪除，如果你使用CSS解決方案，它不需要$('.zero_menu_content').hide();。

來源

2013-03-13 08:46:52 dfsq

感謝這麼多的工作現在 – Zeroic 2013-03-13 08:49:13

歡迎您！最簡單的解決方案是最好的。 – dfsq 2013-03-13 08:50:03

@dfsq你解決了它與一個錯誤仍然留在代碼中...如果你克服了這個錯誤，那麼你就不需要css了。 – 2013-03-13 08:54:24

//ADDS THE .OVER CLASS FROM THE STYLESHEET ON MOUSEOVER 
$('.').mouseover(function() { 
    $(this).addClass('over'); 

//ON MOUSEOUT REMOVE THE OVER CLASS 
}).mouseout(function() { 
    $(this).removeClass('over');           
});

這將創建一個JS錯誤，因此$('.zero_menu_content').hide();未被觸發。看看控制檯。

來源

2013-03-13 08:48:38 Merec

瞭解如何打開瀏覽器的JavaScript控制檯。礦顯示了這個錯誤：

Syntax error, unrecognized expression: .

...這段代碼觸發：

$('.').mouseover(function() { 
    ^^^

不知道的代碼應該如何看，但如果你取出完整塊手風琴工作正常。

來源

2013-03-13 08:49:55

你也有一個錯誤。

$('.').mouseover(function() { 
    $(this).addClass('over'); 
}).mouseout(function() { $(this).removeClass('over'); });

您將得到未定義的表達式。控制檯中的。因此代碼的執行在那裏終止。

來源

2013-03-13 08:52:28

謝謝我認爲整個代碼需要修復 – Zeroic 2013-03-13 09:03:32

，可以有以下的JavaScript錯誤：

Uncaught Error: Syntax error, unrecognized expression: .

當移動過來：

$('.').mouseover(function() { 
    $(this).addClass('over'); 

//ON MOUSEOUT REMOVE THE OVER CLASS 
}).mouseout(function() { 
    $(this).removeClass('over');           
});

應該是：

//ADDS THE .OVER CLASS FROM THE STYLESHEET ON MOUSEOVER 
$('.zero_menu_content_row').mouseover(function() { 
    $(this).addClass('over'); 

//ON MOUSEOUT REMOVE THE OVER CLASS 
}).mouseout(function() { 
    $(this).removeClass('over');           
});

正確小提琴：http://jsfiddle.net/YU6nZ/12/

來源

2013-03-13 08:52:48 MarcinJuraszek

試試這個，

$(document).ready(function() { 
/******************************************************************************************************************** 
CLOSES ALL S ON PAGE LOAD 
********************************************************************************************************************/ 
$('.zero_menu_content').hide(); 

//ACCORDION BUTTON ACTION (ON CLICK DO THE FOLLOWING) 
$('.zero_menu_title_collapse').click(function() { 

    //REMOVE THE ON CLASS FROM ALL BUTTONS 
    $('.zero_menu_title_collapse').removeClass('on'); 

    //NO MATTER WHAT WE CLOSE ALL OPEN SLIDES 
    $('.zero_menu_content').slideUp('normal'); 

    //IF THE NEXT SLIDE WASN'T OPEN THEN OPEN IT 
    if($(this).next().is(':hidden') == true) { 

     //ADD THE ON CLASS TO THE BUTTON 
     $(this).addClass('on'); 

     //OPEN THE SLIDE 
     $(this).next().slideDown('normal'); 
    } 

}); 


/*** REMOVE IF MOUSEOVER IS NOT REQUIRED ***/ 

//ADDS THE .OVER CLASS FROM THE STYLESHEET ON MOUSEOVER 
$('.').mouseover(function() { 
    $(this).addClass('over'); 

//ON MOUSEOUT REMOVE THE OVER CLASS 
}).mouseout(function() { 
    $(this).removeClass('over');           
}); 

/*** END REMOVE IF MOUSEOVER IS NOT REQUIRED ***/ 




});

我剛纔把你的隱藏（）在開始，

$(document).ready(function(){ 

});

來源

2013-03-13 08:59:23

jQuery的功能無法正常工作與jQuery + css3的一切

回答

相關問題