Menu

배경색상 전환효과

2016. 6. 1. 11:42

안개핑 Javascript

 

 

<html>
<head>
<title>배경화면 전환효과</title>
<link rel="stylesheet" href="style.css">
<script language = "JavaScript">

var fade_effect=3
/*
배경 색상 전환효과를 설정 하세요(기본값 3)
1 : 어둡게 → 중간밝기 → 어둡게
2 : 밝게 → 중간밝기 → 밝게
3 : 밝게 → 어둡게 → 밝게
4 : 밝게 → 아주밝게 → 밝게
5 : 어둡게 → 아주밝게 → 어둡게
*/

 

if (fade_effect==1) {
var darkmax=1
var lightmax=127
}

if (fade_effect==2) {
var darkmax=127
var lightmax=254
}

if (fade_effect==3) {
var darkmax=1
var lightmax=254
}

if (fade_effect==4) {
var darkmax=180
var lightmax=254
}

if (fade_effect==5) {
var darkmax=1
var lightmax=80
}
var hexc = new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F')

var redrgb=lightmax
var greenrgb=lightmax
var bluergb=lightmax

var redcol_1
var redcol_2
var greencol_1
var greencol_2
var bluecol_1
var bluecol_2

var stepmax=3
var stepred=Math.ceil(stepmax*Math.random())
var stepgreen=Math.ceil(stepmax*Math.random())
var stepblue=Math.ceil(stepmax*Math.random())

function setrandomstep() {
stepred=Math.ceil(stepmax*Math.random())
stepgreen=Math.ceil(stepmax*Math.random())
stepblue=Math.ceil(stepmax*Math.random())
}

function makedarker() {
redrgb-=stepred
greenrgb-=stepgreen
bluergb-=stepblue
if (redrgb<darkmax) {redrgb=darkmax}
if (greenrgb<darkmax) {greenrgb=darkmax}
if (bluergb<darkmax) {bluergb=darkmax}
if (redrgb>darkmax || greenrgb>darkmax || bluergb>darkmax) {
redcol_1 = hexc[Math.floor(redrgb/16)];
redcol_2 = hexc[redrgb%16];
greencol_1 = hexc[Math.floor(greenrgb/16)];
greencol_2 = hexc[greenrgb%16];
bluecol_1 = hexc[Math.floor(bluergb/16)];
bluecol_2 = hexc[bluergb%16];
var backcolor="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2
document.bgColor=backcolor
var timer=setTimeout("makedarker()",100);
}
else {
clearTimeout(timer)
setrandomstep()
setTimeout("makelighter()",2000)
}
}

function makelighter() {
redrgb+=stepred
greenrgb+=stepgreen
bluergb+=stepblue
if (redrgb>=lightmax) {redrgb=lightmax}
if (greenrgb>=lightmax) {greenrgb=lightmax}
if (bluergb>=lightmax) {bluergb=lightmax}

if (redrgb<lightmax || greenrgb<lightmax || bluergb<lightmax) {
redcol_1 = hexc[Math.floor(redrgb/16)];
redcol_2 = hexc[redrgb%16];
greencol_1 = hexc[Math.floor(greenrgb/16)];
greencol_2 = hexc[greenrgb%16];
bluecol_1 = hexc[Math.floor(bluergb/16)];
bluecol_2 = hexc[bluergb%16];
var backcolor="#"+redcol_1+redcol_2+greencol_1+greencol_2+bluecol_1+bluecol_2
document.bgColor=backcolor
var timer=setTimeout("makelighter()",100);
}
else {
clearTimeout(timer)
setrandomstep()
setTimeout("makedarker()",2000)
}
}
makedarker()
</script>
</head>
<body >
<p align="center">&nbsp;</p>
<table width="300" height="250" border="1" align="center" cellspacing="0" bordercolordark="white" bordercolorlight="black"><tr><td align=center valign='middle' width="563">
            <span style="font-size:9pt;"><font face="TTche"><BR><BR><img src="imge/kitty.gif" width="112" height="115" border="0"></font></span>

</td></tr></table>
<p align="center"><SCRIPT LANGUAGE="JavaScript">
<!--
function sourceopen() {
var This_URL = "";
This_URL = document.location;
window.location = "view-source:"+This_URL;
}
-->
</SCRIPT>
</p>
</body>
</html>

 

'Javascript' 카테고리의 다른 글

선택메뉴  (0) 2016.06.01
점차확대되는 이미지  (0) 2016.06.01
배경이미지 스크롤 효과  (0) 2016.06.01
좌측에서 위아래로 스크롤되는 로고  (0) 2016.06.01
일정시간후 자동으로 닫히는 윈도우  (0) 2016.06.01