jquery로 플래시 효과

Question

나는 fadeIn 및 fadeout을 원합니다. backgroud-color jQuery를 사용하여 아래 코드를 시도했습니다. 전체 div 내용에 영향을 미치므로 배경색 만 플래시 효과를 추가해야합니다.

$('.countbox').css("background-color","#FF0000").fadeIn("fast").delay(800) 
    .fadeout("fast"); 
<div class="countbox">checkout</div> 

나는 이것을 시도했지만 작동하지 않습니다!

$('.countbox').css("background-color","#FF0000").fadeIn("fast").delay(800).css("background-color","#FFFFFF"); 

누구든지 나를 도울 수있는 문제가 무엇입니까?

편집

아차! 내 대답이 모든 창에 적용되지 않습니다. 어느 쪽이 현재 창에 대해서만 플래시 효과를 주지만 모든 창에 플래시 효과를 가져와야합니다. 예를 들면 : - 버튼을 클릭하면이 창이 website과 똑같이 모든 창에 대해 div에 플래시 효과를 주어야합니다.

Answer 1

희망이 도움, 당신은이 일이 일어날 때 신호를 서버에 다시 게시 어떤 종류의가 필요합니다.

omerkirk의 대답을 확장하면 (이 IMO를 수행하는 올바른 방법입니다).

setInterval (function() {. get();}); 이는 주기적으로 현재 상태를 저장하는 백그라운드 서버 (사용자 당 아마 ...)로부터 정보를 얻습니다. 현재 상태가 바뀌면 현재 창 배경에있는 .animate();을 백그라운드 서버의 배경과 동일하게 만듭니다.

하나의 마스터 창 대신 여러 개의 '운전'창을 사용하면 매우 까다롭고 문제가 발생할 수 있습니다 및 x 클라이언트 것들 ...

정말이 나쁜 생각은 IMO ...

Answer 2

당신은 background-color의 opacity 애니메이션을 할 수 jQuery animate backgroundColor

Answer 3

에서 DrJokePu의 답변을 생각해 보자. 색상 만 애니메이션으로 만들 수 있습니다.

Check this plugin.

Answer 4

이 어떤 플러그인

$('.countbox').css("background-color","#FF0000"); 
setTimeout(function() { $('.countbox').css("background-color","#FFFFFF"); },800); 

우리는 또한 연속 색상이 방법 안에 무작위로 생성 된 색상으로 setInterval을를 사용하여 깜박이는 수없이 나를 위해 작동합니다.

Answer 5

이렇게하면됩니다. Jquery에는 플러그인을 사용할 필요가없는 자체 애니메이션 기능이 있습니다.

$(".countbox").animate({backgroundColor: "#ff0000"}, 1000); 

배경색을 1000 밀리 초 (1 초)의 초기 값에서 # ff0000으로 지정해야합니다. jQueryUI의 애니메이션 패키지를 포함시켜야한다고 생각합니다.

그것은 당신이 당신의 의견에 언급하고 별도의 창에서이 작업을 수행 할 수

Answer 6

대답이 당신은 아마이되고 싶어보다 조금 더 많은 작업이 될 것입니다 의견

를 기반으로 업데이트되었습니다. 2 개의 테이블이있는 데이터베이스가 필요합니다. 표는 활성 세션 ID를 개최하고 테이블이 메시지를 개최한다 :

tblSessions 
    ID   Int 
    LastSeen  DateTime 
    SessionID  Varchar(255) 

tblMessages 
    ID   Int 
    Timestamp  DateTime 
    SessionID  Varchar(255) 
    Message  Varchar(255) 

방문자가 페이지에 올 때, 당신은 방문자가 세션 ID가 있는지 확인해야합니다. 방문자가 이미 세션 ID를 가지고있는 경우 tblSessions 테이블의 LastSeen 열을 업데이트하십시오. 방문자가 세션 ID를 가지고 있지 않으면 on을 지정하고 tblSessions 테이블에 추가하십시오. 이 코드는로드 될 때 모든 페이지에서 실행되어야합니다.

데이터베이스 테이블 tblSessions에 대한 쿼리를 실행하여 LastSeen의 X 시간보다 오래된 모든 항목을 제거해야합니다. X의 값은 5 분입니다. 이 쿼리는 각 페이지로드 상단이나 서버 백엔드 프로세스에서 실행할 수 있습니다.

이제 모든 사용자의 화면을 깜박이기를 원할 때 tblSessions에 각 항목에 대해 tblMessages에 항목을 추가합니다. Timestamp을 메시지를 보내는 시간으로 설정하고 Message를 "flash"로 설정하십시오.

자바 스크립트의 브라우저 측에서 setInterval으로 폴링 기능을 설정하십시오. 폴링 함수에서 서버 쪽 페이지로 ajax 스크립트를 호출하여 메시지를 반환합니다. 이 서버 측 스크립트는 tblMessages에 현재 세션 ID에 대한 항목을 쿼리하여 다시 전달해야합니다. 또한 테이블에서 항목을 제거해야합니다.

위로 자바 폴링 기능에서 "플래시"메시지를 확인하고 화면을 깜박일 수 있습니다. 폴링 기능이 더 자주 호출되면 실시간으로 방문자는 이지만 부하는 이상입니다.

tbleSessions 테이블과 마찬가지로 tblMessages 테이블에서 이전 항목이 X +1 분 이상 지나면 문제가 발생할 수있는 오래된 결과가 테이블에 나타나면 제거해야합니다.

이렇게. 대략 한 번에 페이지를 방문하는 모든 사용자를 위해 화면이 깜박입니다. 네트워크 지연과 약간 다른 시간에 투표하는 모든 사람들이 정확히 같은 시간에 플래시 할 방법이 없으므로 대략 말합니다 .... 어떤 경우에도 쉬운 방법은 아닙니다.

Answer 7

당신이 찾고있는 것은 무엇입니까? 데모를 참조하십시오 위해

http://jsfiddle.net/naveed_ahmad/GbvGU/

Answer 8

클라이언트 (단일 브라우저)에 배경 플래시 에, 당신이 JQuery와 .animate()를 사용할 수 있습니다. 콜백에서 또는 번 플래시 일 때 함수로 사용합니다.
플래시을 인터넷에서 사용하려면 열려있는 모든 브라우저에서이 애니메이션을 실행해야합니다. 두 가지 방법이 있습니다.

1. 세트 이 그것을해야 플래시, 또는 여부를 서버 데이터를 확인합니다 클라이언트에서 타임 아웃. 의 아래쪽면은 "거의 "데이터를 저장하려는 경우 을 자주 폴링해야하며 플래시는 번 모두에 대해 동시에 번 발생하지 않습니다.
2. 서버 측 콜백이 발생하면 모든 열린 클라이언트에 번 플래시 ()가 데이터가 변경되었지만 서버 측 로직 없이는 수행 할 수 없습니다. ASP.NET 웹 페이지와 함께이 일을하는 것은 읽기이 http://msdn.microsoft.com/en-us/library/ms178208.aspx 그것은, 내가 얼마 전에 내 자신의 프로젝트를 ^^ 찾으려고 노력 귀하의 게시물, 내가 개발, 정확히 무엇을하는 jQuery 플러그인을 늦은 답변을 찾았다

Answer 9

너는하고 싶어.

그것은 사용하기 매우 쉽습니다 :

$("selector").flash() 

는 물론 일부 구성 할 수있다.

데모를 확인하고/fork를 사용하십시오.

https://github.com/MarechJ/jQuery.flash