하이라이트 효과, 레일즈, jQuery UI, CoffeeScript 내에서 텍스트 색상 변경

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

당신은 단지 배경 색상을 변경합니다 hightlight 효과에 대한 기본 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