萬盛學電腦網

 萬盛學電腦網 >> 網絡編程 >> 安卓開發 >> 如何讓html5換背景顏色?

如何讓html5換背景顏色?

點擊按鈕後切換網頁的背景顏色,不點擊的時候會自動變換,處於待命狀態,當然你還可以控制它不讓他自動播放,點擊按鈕後可以獲取當前的十六進制顏色值,你直接復制就可以使用了。 下面我們給大家介紹一下html5換背景顏色的制作方法吧!

<html>

<head>

<title>按鈕切換背景</title>

<style type="text/css">

.grigg{

position:relative;

font-family:Verdana;

font-size:16px;color:#ffffff;

}

</style>

<script language="JavaScript">

y=" ";

function colourWrite(){

y=document.bgColor;

if (document.layers)

{x=document.FM.box.value}

if (document.all)

{x=document.all.kurt.innerHTML}

r=x+=y.toUpperCase();

Wrte=r+" ";

if (document.layers)

{

document.FM.box.value=Wrte;

document.layers.kurt.document.open();

document.layers.kurt.document.write("<div style='position:absolute;top:0px;left:0px;font-family:Verdana;font-size:16px;color:#ffffff;'>"+Wrte+"</div>");

document.layers.kurt.document.close();

}

if (document.all)

document.all.kurt.innerHTML= Wrte;

}

</script>

<script language="JavaScript">

var amount=0;

function counter(){

var colourElements="0123456789ABCDEF";

var Split=colourElements.split('');

for (i=0; i < Split.length; i++)

var a=Math.round(Math.random()*[i]);

var b=Math.round(Math.random()*[i]);

var c=Math.round(Math.random()*[i]);

var d=Math.round(Math.random()*[i]);

var e=Math.round(Math.random()*[i]);

var f=Math.round(Math.random()*[i]);

var G=Split[a];

var H=Split[b];

var I=Split[c];

var J=Split[d];

var K=Split[e];

var L=Split[f];

//stop error!

if ((G == null)||(H == null)||(I == null)||(J == null)||(K == null)||(L == null))

counter();

else

{

var RandomColour=G+H+I+J+K+L;

document.bgColor=RandomColour;

amount++;

TMR=setTimeout('counter()',1500)

}

}

//-->

</script>

</head>

<body>

<FORM NAME=FM>

<INPUT TYPE=BUTTON value="開始變色" onClick="counter()">

<INPUT TYPE=BUTTON value="暫停變色" onClick="window.clearTimeout(TMR)">

<INPUT TYPE=BUTTON value=" 獲取顏色值 " onClick="colourWrite()">

<INPUT TYPE=hidden name=box>

</FORM>

<div id=kurt class=grigg></div>

</body>

</html>

以上就是我們給大家介紹的html5換背景顏色的制作方法了。希望大家繼續關注我們的網站!

copyright © 萬盛學電腦網 all rights reserved