2

このhttp://pioupioum.fr/sandbox/jquery-color/のようなものは、プロトタイプと scriptaculous ですか?

セクシーでファンシーなものを得るために、ウェブサイトの背景に定期的に RGBA をアニメーション化したいと考えています...

4

1 に答える 1

0

rgbaはかなり最近のもので、最新のブラウザでのみサポートされています。幸いなことに、これらはCSS トランジションもサポートするブラウザーとほとんど同じなので、Javascript ライブラリーは必要ありません。この実際の例を見てください: Massiveblue.com

ソースはそれを説明しています：

body, #logo h1 a, ul#menu li.on {background-color: #39f !important;}
@-webkit-keyframes colours {
      0% {background-color: #39f;}
     15% {background-color: #8bc5d1;}
     30% {background-color: #f8cb4a;}
     45% {background-color: #95b850;}
     60% {background-color: #944893;}
     75% {background-color: #c71f00;}
     90% {background-color: #bdb280;}
    100% {background-color: #39f;}
}
body, #logo h1 a, ul#menu li.on {
    -webkit-animation-direction: normal;
    -webkit-animation-duration: 60s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: colours;
    -webkit-animation-timing-function: ease;
}

キーフレームは、フレームのシーケンスとして「色」を指定し、animation-nameルールで使用されます。これanimation-iteration-countはinfinite、連続してループするためです。-webkit-将来の互換性のために、各プレフィックスを使用-moz-し-o-て、さまざまなブラウザーの規則と、プレフィックスのない 1 つのセットを複製することを忘れないでください。

于 2011-10-07T14:32:13.663 に答える