1

目標は、ユーザーがマウスオーバーしたときに、Wordpressで生成されたタグクラウドにさまざまな色のCSS背景をランダムに割り当てることです。

私の方法（これまでのところ成功していません）： 

        <?php 
            $colors = array( 0 => "#645676", "#427048", "#654335", "#ab2805", "#a59d57", "#302f2f", "#81510d" );
            $tags = wp_tag_cloud('smallest=10&largest=10&unit=px&number=40&format=array&echo=0'); 
            shuffle($tags); 
            foreach ($tags as $tag) { 
                    shuffle($colors);
                echo "<li style=\"a:hover=background:".$colors[0].";\"> $tag \n </li>"; 
            } 
        ?>

これを行うには、foreachPHPループが最も簡単な方法だと思いました。2つの配列（$colorsと$tags）を作成しました。使用したい色の16進タグを$colorsに手動で入力しました。$ tagsには、このブログで最も人気のある40個のタグを取得するように設定したwordpressタグクラウド配列（興味がある場合は詳細はこちら：http：//codex.wordpress.org/Function_Reference/wp_tag_cloud ）が入力されます。

次に、$ tagsでPHPシャッフル関数を使用して上位40個のタグを混同し、それらの40個のタグをforeachループで実行します。次に、シャッフルされた$colorの1つをCSS疑似クラスにランダムに割り当てます。

コードは機能します。出力のサンプルを次に示します。

<li style="a:hover=background:#302f2f;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/truvia/' class='tag-link-49' title='3 topics' style='font-size: 10px;'>truvia</a> 
 </li><li style="a:hover=background:#81510d;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/cancer/' class='tag-link-8' title='11 topics' style='font-size: 10px;'>cancer</a> 
 </li><li style="a:hover=background:#427048;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/antioxidants/' class='tag-link-93' title='4 topics' style='font-size: 10px;'>antioxidants</a> 
 </li>

問題：いずれかのタグにマウスを合わせると、背景が表示されません。これはCSSが悪いかもしれないと私に思わせます。

ピーナッツギャラリーに関するいくつかの質問：
1）PHPを介してCSS疑似クラスをランダムに適用するにはどうすればよいですか？
2）これが機能したとしても、CSSは標準に準拠してここに出力されますか？
3）ここで標準についても心配する必要がありますか？

返信をお待ちしております。よろしくお願いいたします。

4

3 に答える 3

0

インラインCSSでa：hoverを書く方法は？

簡単な答え：できません。

長い答え：あなたはすべきではありません。

クラス名またはIDを付け、スタイルシートを使用してスタイルを適用します

：hoverは疑似セレクターであり、cssの場合、スタイルシート内でのみ意味があります。インラインスタイルに相当するものはありません（選択基準を定義していないため）。

于 2010-11-08T20:01:18.860 に答える
0

最初に飛び出すもの。背景色を変更するだけで、背景に関連する残りのアイテムを変更しない場合は、変更するターゲット要素として背景色を使用する方がよい場合があります。次に、ランダム化した場合でも、おそらくcssをスタイルシートにレンダリングし、各タグに適切なクラスを与えます。

<li class="pseudo_01"> <a href='http://localhost:8888/nutritionwonderland_2/tag/truvia/' class='tag-link-49' title='3 topics' style='font-size: 10px;'>truvia</a>

と

<style>
.pseudo_01{
...
}
</style>
于 2010-11-08T20:01:59.070 に答える
0

これにはJavaScriptが必要だと思います。PHPはサーバー側であるため、マウスオーバーでランダムな色を選択することはできませんでした。私はその質問を完全に誤解したかもしれません。ページの読み込み時にランダムな色を選択して、マウスを重ねるたびに同じ色を表示したくないと思います。

于 2010-11-08T20:21:30.327 に答える