jsタブ【マウスのタイトルは、対応する内容を表示し、他のタイトルの色を変えて隠します】…

8959 ワード





 

        
    
    
    <span style="color:#000000;">
       

        $(document).ready(</span><span style="color:#0000ff;">function</span><span style="color:#000000;"> () {
            setTab(</span>'Label', 1, 7<span style="color:#000000;">)
        });

        </span><span style="color:#0000ff;">function</span><span style="color:#000000;"> setTab(name, cursel, n) {
            </span><span style="color:#0000ff;">for</span> (i = 1; i <= n; i++<span style="color:#000000;">) {
                </span><span style="color:#0000ff;">var</span> menu = document.getElementById(name +<span style="color:#000000;"> i);
                </span><span style="color:#0000ff;">var</span> con = document.getElementById("con_" + name + "_" +<span style="color:#000000;"> i);
                </span><span style="color:#0000ff;">if</span> (cursel == 1<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;

                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 2<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;    
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;
                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 3<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;
                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 4<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;
                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 5<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;
                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 6<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "red"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "black"<span style="color:#000000;">;
                }
                </span><span style="color:#0000ff;">else</span> <span style="color:#0000ff;">if</span> (cursel == 7<span style="color:#000000;">) {
                    document.getElementById(</span>"label1").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label2").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label3").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label4").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label5").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label6").style.color = "black"<span style="color:#000000;">;
                    document.getElementById(</span>"label7").style.color = "red"<span style="color:#000000;">;
                }

                con.style.display </span>= i == cursel ? "block" : "none"<span style="color:#000000;">;

            }
        }
    </span>


    
 
 
 
 
 
 
111
222
333
444
555
666
777
 
転載先:https://www.cnblogs.com/JiangXiaoTian/articles/2590071.html