기 타 HTML 고수님에게 도움 요청 드립니다.
2023.09.13 16:46
쳇gpt로 아래와 같은 html코드를 얻어서
사진 3장을 전체화면으로 교대로 띄우는데는 성공했는데요.
여기에서 좀 더 나아가 그 JPG 파일들을 1시간 정도 간격으로
파일을 다시 읽어들여야 하는 기능이 필요합니다.(파일들이 수정되기 때문에)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>이미지 교대로 전체 화면</title>
<style>
body {
margin: 0;
overflow: hidden;
}
img {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
animation: fade 1s infinite alternate;
}
@keyframes fade {
0% {
opacity: 50;
}
100% {
opacity: 1;
}
}
</style>
</head>
<body>
<img id="image" src="c:\a.jpg">
<script>
const images = ["c:\\a.jpg", "c:\\b.jpg","c:\\c.jpg"];
const imageElement = document.getElementById("image");
let currentIndex = 0;
function changeImage() {
currentIndex = (currentIndex + 1) % images.length;
imageElement.src = images[currentIndex];
}
setInterval(changeImage, 5000); // 5초마다 이미지 변경
</script>
</body>
</html>
능력자님들 도와 주세요.!!!
댓글 [2]
번호 | 제목 | 글쓴이 | 조회 | 등록일 |
---|---|---|---|---|
[공지] | 질문과 답변 게시판 이용간 유의사항 | gooddew | - | - |
98052 | 소프트웨어| 꼬져님 수정-Windows10 Pro 22H2 x64 (19045.3448).iso 스... [2] | 서민 | 356 | 10-17 |
98051 | 기 타| 미니pc 추천좀 부탁드립니다. [2] | 칠월일일 | 281 | 10-17 |
98050 | 소프트웨어| IDM(인터넷다운로드매니저) subtitles 질문 [1] | 푸아송 | 275 | 10-17 |
98049 | 윈 도 우| 윈도우 설치하고 나서 드라이버는 따로 잡아주시나요? [3] | 너구리세상 | 474 | 10-16 |
98048 | 윈 도 우| 윈11.23H2.22635.2500 버전 크롬이 로딩이 많이 느리네요. [2] | 타천사둘리 | 405 | 10-16 |
98047 | 윈 도 우| UUP Dump 저만 이상한가요? [4] | DarknessAn | 299 | 10-16 |
98046 | 윈 도 우| MS SQL 데이터베이스 백업관련 문의 [6] | magoo | 233 | 10-16 |
98045 | 하드웨어| ASRock 보드에 m.2 nvme 장착호환여부 [4] | 내가잘나가 | 419 | 10-16 |
98044 | 기 타| usb 고장 응답없음 [6] | 달그림 | 361 | 10-16 |
98043 | 윈 도 우| 영구 없다? [6] | 초심겸손 | 1085 | 10-16 |
98042 | 윈 도 우| 메인보드 AS로 교체 후 윈도우 정품인증이 안되네요 [12] | 『ⓖⓤⓝ』 | 1142 | 10-15 |
98041 | 모 바 일| 초등학생이 쓸만한 펜 사용가능한 태블릿 추천 해주세요. [4] | 현민지 | 273 | 10-15 |
98040 | 소프트웨어| map 한글팩구할수있을까요 | 고스트120034 | 186 | 10-15 |
98039 | 윈 도 우| 윈도우 로긴단계에서 초기화 할 수 있나요? [2] | brucex | 246 | 10-15 |
98038 | 윈 도 우| xp pe 구해요 [5] | 달그림 | 517 | 10-15 |
98037 | 소프트웨어| 한컴오피스뷰어 2024 실행시 광고창 안뜨게 하는 법 문의 [5] | 빨간돼지 | 1027 | 10-15 |
98036 | 윈 도 우| 레지스트리 편집기 [2] | 어차피 | 220 | 10-15 |
98035 | 소프트웨어| VENTOY로 대용량 ISO를 부팅하면 느려지나요? [1] | ksire | 305 | 10-15 |
98034 | 소프트웨어| IMAGE FOR WINDOWS 질문 [2] | 미지수 | 221 | 10-15 |
98033 | 소프트웨어| 레노버 아이디어패드 슬림 1 15AMN7 에서 부팅할수있는 PE... [2] | 좋은데이 | 183 | 10-15 |
function changeImage() {
currentIndex = (currentIndex+1) % images.length;
let today = new Date() ;
tempt = today.getHours();
imageElement.src = images[currentIndex]+'?time='+tempt;
}
changeImage 함수를 바꾸면 시간이 바뀌면 불러오는 url 값이 변경되므로 다시 읽어올것으로 예상되는
단점은 편법으로 구현하다보니 시간 측정을 따로 하지 않아서 들어오는 순간에 따라 동작 시간이 달라짐...
5분에 들어오면 55분뒤에 바뀌고 55분에 들어오면 5분뒤에 바뀌고 그이후는 1시간마다...