我找不到解决这个问题的简单方法.

当按钮点击出现错误时,我试图淡化某些文本的颜色变化.

if (document.getElementById("username").value == ""){ //First Name      
    $("#login_error").text("Please enetr a username!").css('color', '#FF0000');     
    $("#username_label").css('color', '#FF0000');fadeIn(3000);
}

我可以改变颜色,但它是即时的.我想让颜色的变化慢慢消失.

多谢你们!

我有大约100个元素,我试图用jquery创建一个动画.

<div class="box" id="a1"></div>

我需要根据函数为每个元素添加特殊样式.

其中哪些在浏览器中呈现得更快:

添加css属性

$(this).css({'background-color':'#000'})

或者添加课程

$(this).addClass("style1")

更新 了我想添加的更多内容:

• 现在它有100个元素,并通过jquery添加它们.
• 要创建随机性,我需要创建大约25种样式 - 我正在通过javascript进行
• 我是否也应该将样式表的大小添加到相同的位置以获得准确的基准.

我做错了什么，以下内容没有为背景颜色设置动画？

<div style="height:100px;width:100px;background:red">animate this</div><br>
<input type="button" id="mybutton" value="start"/><br>


$("#mybutton").click(function(){
   $("div").animate({backgroundColor: 'blue'});
});

http://jsfiddle.net/bjf2L0ha/

我有这张桌子:

<table id="social" border="5">
    <tr>
        <td>
            <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fyannbane.blogspot.com%2F&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&amp;appId=177127339057410" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
        </td>

        <td>
            <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://yannbane.blogspot.com/" data-via="Yannbane">Tweet</a>
        </td>

        <td>
            <g:plusone></g:plusone>
        </td>
    </tr>
</table>

我想用jquery为它的边界设置动画,如下所示:

$("#social").animate({"borderTopColor": "#f00", "borderBottomColor": "#fff"}, 800);

但是,它不起作用!什么都没发生,即使没有显示错误......

我也试过这个:

$("#social").animate({"border-top-tolor": "#f00", "border-bottom-color": "#fff"}, 800);

但结果相同......你是怎么做到的？

抱歉英文不好.

jQuery 的animate函数在第2行工作正常.但在第3行不起作用...为什么？

  $('.opac').hover(function(){  
    $('img', this).animate({opacity: '0.6'}, 500);
    $('p', this).animate({background: 'orange'}, 500);   
  });

HTML是这样的:

  <div class="opac">
    <img src="image.png" />
    <p class="fot">text here...</p>
   </div>

谢谢!ps:开发人员工具不会给出任何错误......

我试图根据空闲/移动使背景改变颜色.

这是有效的,但我不能使用淡入淡出淡出它.

JSFiddle - 没有淡入淡出的工作示例

什么是淡化背景的最佳解决方案

$("body").css('background-color','#000');

 $(document).ready(function () {
        var idleState = false;
        var idleTimer = null;
        $('*').bind('mousemove click mouseup mousedown keydown keypress keyup submit change mouseenter scroll resize dblclick', function () {
            clearTimeout(idleTimer);
            if (idleState == true) { 

                    $("body").css('background-color','#fff'); 

            }
            idleState = false;
            idleTimer = setTimeout(function () { 

                    $("body").css('background-color','#000');

                idleState = true; }, 2000);
        });
        $("body").trigger("mousemove");
});

当鼠标悬停在div元素上时,我有以下JQuery代码将div的背景颜色淡化为不同的颜色.它工作得很好,但它需要jqueryui.js才能工作.我的页面已经将jquery.js用于其他目的,所以我必须加载两个框架.

这可以只用jquery而不是jqueryui来完成吗？

<!-- fade page onload -->
$(document).ready(function(){
    $('#page_effect').fadeIn(1000);
});
<!-- fade login form to color on hover -->
$(document).ready(function() {
    $("#frmLogin").hover(function() {
        $(this).stop().animate({ backgroundColor: "#fff"}, 800);
    }, function() {
        $(this).stop().animate({ backgroundColor: "#e6e6e6" }, 800);
    });
});

谢谢!

我正在尝试为 div onclick 的背景颜色设置动画，但它根本没有改变它：

超文本标记语言

<div id="list2" onclick="changeCol();">
    color
</div>

CSS

#list2{ width:200px; height:100px; border:1px solid #ccc; background-color:#ccc}

jQuery/JS

function changeCol(){
    alert('foo'); // testing function called
    $("#list2").animate({
      backgroundColor: "#8bed7e"
    }, 500).animate({
      backgroundColor: "#ccc"
    }, 500);
}

有什么想法吗？这是一个小提琴

我有一个名为#link的链接.

它在悬停后改变颜色,如下所示:

$("#link").hover(function(){
     $(this).css({color: '#fed900'});
});

我想做的就是平滑,动画的颜色变化.

我知道我必须以某种方式将.css放在.anss中,但无法弄清楚如何.

我认为这是正确的方式,但它根本不起作用:

$("#link").hover(function(){
     $(this).animate( { css({color: '#fed900'}) }, "slow" );
});

我也尝试过这样的:

$(this).animate({ .css({color: '#fed900'}), "slow" });   

但我还是错了.有帮手吗？我知道我错过了一些非常小的东西.

看到我有一个jquery代码,我认为它应该工作,但它仍然无法正常工作!所以请帮帮我.输入具有原始背景颜色#fff,我希望在聚焦时输入背景颜色应该变为#789具有淡入淡出效果.这是我所做的代码.

$('input.login_reg_input').focus(function () {
   $(this).animate({
     backgroundColor:fadeColor
   }, 250, 'linear', function() { });
});

我已经搜索了stackoverflow并且没有找到一个好的解决方案.所以请帮我解决这个问题.

提前致谢!

我试图想象一下简单的jQuery代码是什么,在悬停时淡入rgba背景颜色,然后当你将鼠标移离div时淡出.

我说"rgba"的原因是因为它需要70%不透明黑色,但如果可以用jQuery自己的不透明度来完成,那就太酷了.

一个完美的例子是http://dalhov.se,除了他们使用更复杂的方法,我很难学习.

谢谢,韦德

我通过单击按钮将行添加到预先存在的表中.为了区分添加了哪些行,我为添加的行添加了背景颜色.但是,我想在一段时间后删除这种背景颜色或淡出它.

这就是我现在正在做的事情:

    $("#numlist").prepend("<tr class='newrow'><td>somenum</td></tr>");

我怎么能淡出课程newrow？

这是一个例子:http://jsfiddle.net/Nx2nC/

我使用以下代码片段制作元素的背景浅蓝色,然后在30秒内慢慢淡化为白色:

$("#" + post.Id).css("background-color", "lightblue")
.animate({ backgroundColor: "white" }, 30000);

两个问题.

首先,有没有办法将不透明度淡化到100%？这样,如果我选择更改页面的背景颜色,我不必更改"白色"？

其次,大约每10或15次一次,背景保持浅蓝色并且不会褪色为白色.我正在使用最新版本的jQuery和UI核心.怎么可能出错？

编辑:赏金是解决第二个问题的问题.

EDIT2:

显然我被遗忘了,因为我说我推出了自己的解决方案,但没有显示出来.我的错.我不想自我推销.我的代码100%的工作时间,不需要jQuery.演示和代码可以在以下位置找到:

http://prettycode.org/2009/07/30/fade-background-color-in-javascript/