0

この例http://codepen.io/jezen/pen/CAHskを見ると、アニメーションが Chrome (v29) (および他の最新のブラウザー) で実行されていることがわかります。まったく同じ CSS コードをローカル ドライブに保存し、CSS ファイルを参照する非常に単純な HTML ページを作成しました。ページが読み込まれ、CSS スタイルが適用されますが、ローカル バージョンでアニメーションが実行されません。

HTML ファイルは次のように単純です。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Arcs</title>
    <link rel="stylesheet" type="text/css" href="arcs.css">
</head>
<body>
<ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
</body>
</html>

そして、私が参照している arcs.css ファイルは、上記でリンクしたソース サイトからの正確なコピー/貼り付けです。

もう一つ興味深い情報。著者のデモ サイト ( http://jezenthomas.com/experiments/arcify/ ) に同じブラウザーでアクセスすると、アニメーションは問題なく実行されます。しかし、提供されている例の「HAML」、「JS」または「CSS」タブをクリックしてから、「結果」タブに戻ると、アニメーションが実行されなくなっていることがわかります。

4

1 に答える 1