1

私が構築しているサイトの上部に古い「フォントのサイズ変更」オプションが必要です.1つのリンクはデフォルトサイズで、1つはフォントを1サイズ大きくし、もう1つはフォントを2サイズ大きくします。いくつかのナビゲーションと本文のコピーに影響を与えるだけでよいので、これらの要素のスタイルを設定するだけの 2 つの追加のスタイルシートを作成し、リンクの 1 つをクリックすると、追加のスタイルシートをヘッダーに読み込みます。「デフォルト」リンクをクリックすると、元のサイズに戻ります (追加のスタイルシートは読み込まれません)。

JavaScriptでこれを行う方法はありますか？これはワードプレスのサイトです。別の方法として、js を使用して本文にタグを追加し、そのように要素をターゲットにすることもできます。

これを行う最善の方法は何ですか？

4

4 に答える 4

2

要素のクラスを変更するだけです。これにより、css が、スタイルシートのそのクラスによって指定されたものに変更されます。最初のオプションは、必要以上に複雑です。JQuery を使用すると、文字通りこの 1 行のコードで作成できます。

$("span#applicableId").each(function(){ 
    $(this).class("theOtherClass");
});
于 2012-11-19T18:47:50.763 に答える
1

以下のようなものを使用して、その場でスタイルシートを動的に追加できます。

function loadNewStyleSheet() {
        var style = document.createElement('style');
        style.type = 'text/css';
        style.src = 'http://path/to/cssfile'
        document.body.appendChild(style);
            }
于 2012-11-19T18:51:26.183 に答える
0

これは、php タグの include ステートメントとして行います。次に、各ページの上部に 1 つの php ファイルを含めるだけです。

php インクルード情報: http://php.net/manual/en/function.include.php

そこから、再利用できるコードがいくつかあるに違いありません。

たとえば、これは何かの助けになるでしょうか？これは、ページの CSS スタイルを調整し、他の部分に干渉しない PHP スクリプトです。 http://www.phpclasses.org/package/1296-PHP-Resizes-text-on-a-page-using-styles-and-sessions-.html

于 2012-11-19T18:49:13.700 に答える
0

ヘッドタグに動的に追加することはできないと思います。もちろん、それは可能ですが、このスタイルシートは読み込まれません。おそらく、ajax 経由で取得して、サイトの特別なスクリプト タグに追加する必要があります。ユーザーが別のオプションを選択する場合は、別のコンテンツをロードし、このスクリプト タグをクリアして、そこに新しいコンテンツを追加します。

于 2012-11-19T18:49:29.753 に答える