【问题标题】:Toggle animation or Css切换动画或 Css
【发布时间】:2011-07-22 20:39:34
【问题描述】:

如何切换动画或 CSS 更改?例如,我想要一个按钮,按下时会改变字体大小,然后再次按下时会变回来。我当然可以使用两个按钮,但最好有一个按钮。我尝试在更改字体大小后立即更改按钮的 id,然后为新 id 使用单独的函数将其更改回来,但这似乎不起作用。

对不起,我是 Jquery 的新手 :)

谢谢!

【问题讨论】:

  • 永远不要随意更改 ID...ID 主要用于布局,只能在一个地方使用等(很多原因)。改用类,例如您可以将多个类添加到标签中。

标签: jquery css toggle font-size


【解决方案1】:

为您想要的样式创建一个类并使用toggleClass 切换类。

示例用法

$(this).toggleClass('class');

Live Demo

动画包含 jQueryUI 效果核心并执行此操作

$(this).toggleClass('large', delay);

Animation Demo

Reference

【讨论】:

【解决方案2】:

可能是这个jQuery toggle CSS?的重复

【讨论】:

    【解决方案3】:

    试试这个

     $(function(){
    
        $('#button').click(function(){
    
        if (!$('.targetContainer').hasClass('bigFont'))
        $('.targetContainer').addClass('bigFont');
        else
        $('.targetContainer').removeClass('bigFont');
    
        });
    });
    

    【讨论】:

    • 基本上是在按钮上设置事件。检查目标容器是否具有您要添加的类样式,如果没有 - 设置类,如果有 - 删除类。
    • 为什么不直接使用 toggleClass 而不是自己创建?
    • 为了获得更多控制,我从不使用切换...尤其是动画...因为快速单击它会导致错误。
    【解决方案4】:

    学习 jQuery 首先更改 CSS 可以使用切换功能来完成。 http://api.jquery.com/toggle/

    $('button').click(function() { $('this').toggle('slow', function() { // Animation complete. }); });

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-09-15
      • 1970-01-01
      • 1970-01-01
      • 2021-10-10
      相关资源
      最近更新 更多