jQuery技术:jQuery – 使用动画仍然需要帮助19.02.2012在div上切换背景颜色

我希望避免使用css转换。

我有三个同一类的div。 我点击时试图切换一个div的背景颜色。 再次单击div或单击其中一个时,我希望它返回默认值。

我已经包含了jQuery颜色插件,并成功地改变了点击的颜色。 我相信我的条件是错误的,这就是为什么我不能在点击其他div时改变颜色。

这就是我所做的:

 jQuery(document).ready(function() { $('.link').click(function() { var $me = $(this); if ($me.css("background-color") == "#993") { $me.animate({backgroundColor:"#246"}, 500); } else { $(".link").each(function() { if ($(this) != $me) { if ($(this).css("background-color") == "#246") { $(this).animate({backgroundColor:"#993"}, 500); } } }); $me.animate({backgroundColor:"#246"}, 500); } }); });   .link { width:100px; padding:10px; background-color:#993; float:left; display:inline; text-align:center; }       

我在理解backgroundColor概念时遇到了一些麻烦,并希望得到帮助。 ?

谢谢!

       

    试试这个。 如果你想使用CSS,CSS3可能会有所帮助。

    有3个div,当你点击其中一个时,它会变成蓝色。 当你点击其他div时,蓝色会变红并点击一个就会变成蓝色。 如果你要点击蓝色,它会变成蓝色。

       

    使用jQuery默认情况下无法为background-color设置动画。 您需要使用jQuery Color这样的插件,它是jQuery UI的一部分。

    然后你可以用toggle()来做到这一点:

    HTML

     

    CSS

     div { height: 50px; width: 50px; background: #ff0000; } 

    JQ

     $('button').toggle(function(){ $('div').animate({'background-color': '#00ff00'}); }, function(){ $('div').animate({'background-color': '#ff0000'}); }); 

    示例

      以上就是jQuery教程分享jQuery – 使用动画仍然需要帮助19.02.2012在div上切换背景颜色相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/548170.html

      (0)
      上一篇 2021年1月13日
      下一篇 2021年1月13日

      精彩推荐