1. ホーム
  2. javascript

[解決済み] jQuery "blinking highlight" effect on div?

2023-04-08 05:28:07

質問

次のような方法を探しています。

を追加しています。 <div> をページに追加し、ajax コールバックが何らかの値を返します。その <div> は ajax 呼び出しからの値で満たされ、そして <div> の前に別の <div> の前に置かれ、テーブルのカラムとして機能します。

ユーザーの注意を引き、ページ上に何か新しいものがあることを示したいと思います。

私は <div> を点滅させ、表示/非表示ではなく、ある時間、例えば5秒間ハイライト/非ハイライトにします。

私はblinkプラグインを見てきましたが、私が見る限り、それは要素に表示/非表示を行うだけです。

Btw、ソリューションはクロスブラウザーでなければならず、そう、残念ながら IE が含まれています。IE で動作するようにするには、おそらく少しハックする必要がありますが、全体としては動作する必要があります。

どのように解決するのですか?

jQuery UI ハイライト効果 は、あなたが探しているものです。

$("div").click(function () {
      $(this).effect("highlight", {}, 3000);
});

ドキュメントとデモは はこちら


編集 :

もしかしたら jQuery UI 脈打つ効果 がより適切である。 をご覧ください。


2番を編集 :

不透明度を調整するには、このようにすればよいでしょう。

$("div").click(function() {
  // do fading 3 times
  for(i=0;i<3;i++) {
    $(this).fadeTo('slow', 0.5).fadeTo('slow', 1.0);
  }
});

...だから不透明度50%より低くなることはない。