>  기사  >  웹 프론트엔드  >  일정한 간격으로 그림을 숨기고 표시하는 JavaScript 방법_javascript 기술

일정한 간격으로 그림을 숨기고 표시하는 JavaScript 방법_javascript 기술

WBOY
WBOY원래의
2016-05-16 15:46:421535검색

이 기사의 예에서는 JavaScript를 사용하여 이미지의 타이밍 숨기기 및 표시를 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.

여기에서는 JavaScript를 사용하여 일정한 간격으로 이미지를 숨기고 표시합니다. 이미지는 몇 초 후에 자동으로 표시되거나 숨겨집니다. JavaScript 코드 조각에서 시간을 직접 정의할 수 있습니다.

작동 효과는 아래와 같습니다.

구체적인 코드는 다음과 같습니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>定时隐藏图片</title>
</head>
<SCRIPT LANGUAGE="JavaScript">
var sec=10;
var timer;
function hidepic()
{
 sec--;
 if (sec==0){
  textfield.value = "图片被隐藏";
  soccer.style.visibility =(soccer.style.visibility == "hidden") &#63; "visible" : "hidden";
 }
 else{
  textfield.value = "图片会在 "+sec+" 秒后隐藏";
  setTimeout("hidepic()",1000);
 }
}
</SCRIPT>
<body onLoad = "hidepic();">
<center>
 <input name="textfield" type="text" size="20"> <br>
 <DIV ID="soccer" STYLE="position:absolute; left:333px; top:43px">
 <img border="0" src="http://www.jb51.net/images/logo.gif" >
 </DIV>
</center> 
</body>
</html>

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.