Question

原始问题： 我能够成功更改高亮效果中的背景颜色，但我也想更改文本颜色。奇怪的是：在这种情况下，颜色属性似乎是指背景颜色，而不是文本颜色：

$newBlogger.effect('highlight', {color: '#DFF2BF'}, 2000)

如何指定文本颜色以便在效果期间也可以更改？

答案：一路上我意识到我可以使用dequeue（）来同时发生高光效果和动画效果。

$newBlogger = $('<%= j render(@blogger) %>').css("color", "#4F8A10").hide()
$("#all_bloggers").append($newBlogger)
$('#new_blogger').fadeOut "fast", ->
    $newBlogger.effect('highlight', {color: '#DFF2BF'}, 1500)
    $newBlogger.animate({"color": "black"}, 1500).dequeue()
    $('#new_link').fadeIn("fast").dequeue()

Answer 1

你是对的，高光效果的默认color选项只会改变背景颜色。您可以尝试在最后添加.css：

$newBlogger.effect('highlight', {color: '#DFF2BF'}, 2000).css("color", "Blue");

这会改变文字的颜色。

或者，您可以使用css规则并使用jQuery添加该类：

change-color {
    color: Blue;
}

$newBlogger.addClass("change-color");
$newBlogger.effect('highlight', {color: '#DFF2BF'}, 2000);

jsFiddle Example

或者，您可以使用animate() - 类似于：

$newBlogger 
    .animate({
        backgroundColor: "#DFF2BF",
        color: "#fff"
    }, 1000)
    .animate({
        backgroundColor: "#fff",
        color: "#000"        
}, 1000);

animate example

在高亮效果，Rails，jQuery UI，CoffeeScript中更改文本颜色

1 个答案: