HOME 　>>> 　HTML整理ノート 　>>> DHTML --　 基本編　　応用編

マイパソコン［VINBO]

電源のon／offできます

◎･●･○･◎･●

　

　

　

　

　

　

　

　

　

Sample Source......................................................................>>>

<script language="JavaScript"><!--
var flg = 0;    //ﾊﾟｿｺﾝの電源がoff(0)／on(1)を区別
function OnOff(){
    if(flg == 0){    //電源を入れる
        D2b.style.backgroundColor = "yellow";
        flg = 1;
        PcStart();
    }else{             //電源を落とす
        D2b.style.backgroundColor = "navy";
        if(timerID != null){
            clearTimeout(timerID);
            n = 1;
        }
        crt.style.backgroundImage = "";
        crt.style.backgroundColor = "silver";
        flg = 0;
    }
}
var n = 1;    //PC画面の切替え用
var timerID = null;
function PcStart(){
if(n < 6){
if(n == 1){    //一番最初の起動時DOS画面
    crt.style.backgroundColor = "black";
    crt.style.color = "white";
    crt.innerHTML = "BIOS version PhoneixBIOS 4.0 Release 6.0
        <br>RAM:256MB nice!!good!!<br><br><br>ABCDEFG<br>
        Windows98 Staring....<br>OK、OK、OK.....";
}else if(n == 2){    //2番目のﾃﾞｽｸﾄｯﾌﾟ画面
    crt.innerHTML = "";
    crt.style.backgroundImage = "url(../images/pc01.jpgg)";
}else if(n == 3){
    crt.style.backgroundImage = "url(../images/pc02.jpg)";
}else if(n == 4){
    crt.style.backgroundImage = "url(../images/pc03.jpg)";
}else if(n == 5){
    crt.style.backgroundImage = "url(../images/pc04.jpg)";
}
n++;
timerID = setTimeout("PcStart()",4000);
}else{    //ｴﾗｰ画面になったらPCを停止する
    clearTimeout(timerID);
    n = 1;
}
}
//--></script>
</head>

<body>
<div id="dv" style="position:absolute;top:70;
    left:200;width:300;height:320;">

<div id="crt" style="position:absolute;top:5;left:10;
    width:280;height:200;background-color:silver;
    border:20 solid #B0B5F4"></div>
<div id="D1" style="position:absolute;
    top:205;left:80;width:140;height:10;
    background-color:#B0B5CC;border:1 solid silver"></div>
<div id="D2" style="position:absolute;top:215;left:20;
    width:260;height:30;background-color:#B0B5F4;
    border:1 solid gray"></div>
<div id="D2a" style="position:absolute;top:218;left:23;
    width:254;height:24;background-color:#B0B5F4;
    border:2 solid silver"></div>
<div id="D2b" style="position:absolute;top:222;left:50;
    width:30;height:5;background-color:navy;
    filter:alpha(opacity=100,finishopacity=0,style=2);
    cursor:hand" onclick="OnOff();"></div>
<div id="D2c" style="position:absolute;top:225;left:200;
    width:60;border-top:8 solid gray"></div>
<div id="D2d" style="position:absolute;top:220;left:215;
    width:30;height:15;background-color:black;
    filter:alpha(opacity=80,finishopacity=0,style=2)"></div>
<div id="D3" style="position:absolute;top:245;left:20;
    width:260;height:50;background-color:#B0B5F4;
    border-top:1 solid silver;border-right:1 solid black;
    border-left:1 solid black;border-bottom:1 solid black;"></div>
<div id="D3a" style="position:absolute;top:277;left:30;
    color:green;font:9pt;border:1 solid gray">
    ◎･●･○･◎･●</div>
<div id="D3b" style="position:absolute;top:255;
    left:190;width:80;border-top:12 solid gray"></div>

</div>

end(最終更新:12/11/6)