jquery实现每次点击元素修改transform-rotate属性 达到每次点击旋转图标方向的效果

今天小薛教大家在jquery中实现每次点击元素修改transform-rotate属性,达到每次点击旋转图标方向的效果。

今天在做一个小玩意,需要实现点击按钮,切换图标的方向,再次点击,图标恢复原状。

最开始使用添加.css('transform','rotateX(180deg)')

发现点击一次后旋转,再次点击时没有复原,记录下,解决这种办法的js代码,方便下次调用

        let icon_css = '.mobile-sidebar-menu .menu-item-has-children .fa-angle-down';
        if ($(icon_css).css('transform') == 'none') { 
         $(icon_css).css({'transform': 'rotate(-180deg)'}); 
        } else { 
         $(icon_css).css({'transform': ''}); 
        }; 

可以使用 console.log($(icon_css).css(‘transform’));

来看看每次点击,元素的transform值,就很好理解了。

图片[1]-jquery实现每次点击元素修改transform-rotate属性 达到每次点击旋转图标方向的效果-一只薛眠羊
© 版权声明
THE END
喜欢就支持一下吧
点赞11赞赏 分享
评论 共1条

请登录后发表评论

    暂无评论内容