1

次の HTML は、私のサイトに派手なフォントを表示します。<h2>

<section id="content">
    <article>
        <h2 id="titletext">Welcome to <span>Pomona High School!</span></h2>
        <p id="infotext" style="width: 773px; height: 28px;" >Welcome to the new Pomona High School site! Please give us feedback!</p>
        <br />
    </article>
</section>​

これは、サイトで非常にうまく表示されます。

ファンシー ヘッダー 2 フォント

ユーザーがタスクバーに移動してサブメニュー項目の 1 つを選択すると、<h2>テキストが指定された文字列値に変更されます。私はJavascriptエディターに入り、次のように作成しました。

window.onhashchange = function() { //when the hash changes (the '#' part)
    var loc = window.location + ""; //get the current location (from the address bar)
    var curHash = loc.substr(loc.lastIndexOf("#")); //get what's after the '#'
    if (curHash == "#mission") { //else if it's #mission
        document.getElementById('titletext').innerHTML = 'Mission Statement';
    }

    else {
        document.getElementById('titletext').innerHTML = 'Welcome to Pomona High School';

    }
};​

メニュー項目の 1 つを #mission にリンクして、テキストを変更することに成功しました。しかし、フォントはデフォルトのフォントに変更されました<h2>。

カスタム フォントを Javascript の文字列に取り込む方法についてサポートが必要です。前もって感謝します！

の CSS スタイルシート<h2>:

h2 {
    font-size: 30px;
    line-height: 1.2em;
    font-weight: normal;
    color: #212222;
    margin-bottom: 22px;
}

h2 span {
    color: #8a8a8a;
}

そして、ここに 2 つのカスタム フォント ファイルがあります (スタック オーバーフローにコピーして貼り付けるには大きすぎます):-

4

2 に答える 2

1

あなたのコードは実際に置き換えています

Welcome to <span>Pomona High School!</span>

と

Welcome to Pomona High School!

注意、要素はありません。spanタグで設定するだけでOKです。

于 2012-10-21T15:45:03.650 に答える
0

出典: MDN ドキュメント

これについて、MDN は次のように述べています。

ウィンドウのハッシュが変更されると、hashchange イベントが発生します (location.hash を参照)。

構文：-

  • window.onhashchange = funcRef;
  • <body onhashchange="funcRef();">
  • window.addEventListener("hashchange", funcRef, false);

渡すのは関数参照だと思いますが、関数を先に定義してから名前付き参照を渡してみてはいかがでしょうか。function() { ... }コードは次のようになります。

function hashChange() { //when the hash changes (the '#' part)
    var loc = window.location + ""; //get the current location (from the address bar)
    var curHash = loc.substr(loc.lastIndexOf("#")); //get what's after the '#'
    if (curHash == "#mission") { //else if it's #mission
        document.getElementById('titletext').innerHTML = 'Mission Statement';
    }

    else {
        document.getElementById('titletext').innerHTML = 'Welcome to Pomona High School';

    }
};

window.onhashchange = hashChange;

</p>

わかりました、私は混乱しています。このJSFiddleで私のために働いているので、何か他のことが起こっているに違いありません...

あなたのコードは、おそらくスタイリングを与えてい<span>たon ハッシュの変更を削除します。<h2>したがって、実際には次のようになります。

window.onhashchange = function() { //when the hash changes (the '#' part)
    var loc = window.location + ""; //get the current location (from the address bar)
    var curHash = loc.substr(loc.lastIndexOf("#")); //get what's after the '#'

    if (curHash == "#mission") { //else if it's #mission
        document.getElementById('titletext').innerHTML = '<span>Mission Statement</span>';
    }

    else {
        document.getElementById('titletext').innerHTML = 'Welcome to <span>Pomona High School</span>';
    }​
}

ifまた、 andelseステートメントを混同していると思います。これ：

else if(curHash == "#mission") {
    ...
}

else {
    ...
}

本当にあるべきです：

if(curHash == "#mission") {
    ...
}

else if {
    ...
}
于 2012-10-21T15:45:16.000 に答える