Question

菜单切换时箭头旋转

2016-05-12

562

javascript jquery html css

如何让箭头在点击时旋转，并在滑动打开另一个菜单或再次单击箭头时旋转回来？

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","" ) ;
}
});

Answer 1

您需要更新您的 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" ) ;
    }
});