菜单切换时箭头旋转

Arrow rotates when menu toggles

本文关键字:旋转 菜单      更新时间:2023-09-26

当我滑动打开另一个菜单或再次单击箭头时,如何让箭头旋转?

JSFIDDLE

JS:

//Dropdown Menu
$("a.slide-dropdown").click(function slideMenu() 
{
$(this).next('ul').slideToggle();
$(this).parent().siblings().children().next('ul').slideUp();
});
//Arrows
$( ".crossRotate" ).click(function() {
//alert($( this ).css( "transform" ));
if ($(this).css( "transform" ) == 'none' )
{
    $(this).css( "transform" , "rotate(-180deg)" );
} 
else 
{
    $(this).css("transform","" ) ;
}
});

您需要更新crossRotate click事件。

试试这个

//Arrows
$( ".crossRotate" ).click(function() {
    //alert($( this ).css( "transform" ));
    $(".crossRotate").css("transform","none" ) ;
    if ($(this).css( "transform" ) == 'none' )
    {
        $(this).css( "transform" , "rotate(-180deg)" );
    } 
    else 
    {
       $(this).css("transform","none" ) ;
    }
});