6

私は純粋なCSSとJavascriptを使用してこれを達成したいと思っています。PHPも大丈夫です。私はjavascriptをもう少し学ぼうとしているので、jqueryを避けています。一部のワードプレスサイトでは、jqueryが常に必要な方法で機能するとは限らないことがわかりました。私が知る限り、プログラム上のエラーは発生していませんが、正しく機能していないように見えるため、何かが欠落しているに違いありません。まず、コードを見つけることができるリンクを示します。http://jsfiddle.net/FFCFy/13/

次に、実際のコードを示します。

Javascript：

setInterval(function() {
    var x = document.getElementById("div1");
    var y = document.getElementById("div2");

    function stext() {
        x.style.color = 'red';
        y.style.color = 'black';
    }

    function htext() {
        x.style.color = 'black';
        y.style.color = 'red';
    }
}, 250);

html：

<html>
<body>
    <span id="div1" style="color:black;" onmouseover="stext"   onmouseout="htext">TEXT1</span><p />
    <hr color="black" />
<span id="div2" style="color:red;"onmouseover="htext" onmouseout="stext">Text2</span>

</body>
</html>

最終的には、これを変更して別のテキストを表示および非表示にしますが、これを理解したら、これに到達します。

4

5 に答える 5

8

次のコードを簡単に使用できます。

<html>
<head>
<body>
<font onmouseover="this.style.color='red';" onmouseout="this.style.color='black';">Text1</font>
<font onmouseover="this.style.color='black';" onmouseout="this.style.color='red';">Text2</font>
</body>
</html>
于 2014-07-12T13:29:00.327 に答える
3

setIntervalは必要ありません。

function stext() {
    var x = document.getElementById("div1");
    var y = document.getElementById("div2");
    x.style.color = 'red';
    y.style.color = 'black';
}

作業中の JSFiddle を更新

</p>

于 2012-10-31T22:27:09.353 に答える
3

なぜだけではないのですか：

#div1:hover {
    color: red;
}
于 2012-10-31T22:32:28.930 に答える
0

setInterval は必要ありません:

 var x = document.getElementById("div1");
 var y = document.getElementById("div2");
 function stext() {
     x.style.color = 'red';
     y.style.color = 'black';
 }
 function htext() {
     x.style.color = 'black';
     y.style.color = 'red';
 }
于 2012-10-31T22:27:12.710 に答える
0

関数htextとstextは匿名関数内で定義されているため、グローバルに使用できません。関数定義を無名関数の外に移動するか、関数をグローバル オブジェクト (ウィンドウ) に割り当てて使用できるようにします。

しかし、もう一度...なぜこのコードは setInterval 呼び出し内にあるのですか? それは意味がありません。

于 2012-10-31T22:29:57.387 に答える