기 타 HTML 고수님께 다시 질문 드립니다.
2023.10.05 16:52
아래 내용으로 만들었고 3개의 이미지를 교대로 보여주는 단순한 문서입니다.
다만 빨강색으로 표시한 파일은 잘 읽어 오는데
파랑색으로 표시한 나머지 파일들은 읽어 오지 못합니다.
뭐가 잘못되었을까요?
다른 컴퓨터의 공유폴더이고 같은 폴더에 있습니다.
<!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="\\BOILER3\SharedDocs\\c.jpg">
<script>
const images = ["\\BOILER3\SharedDocs\\a.jpg","\\BOILER3\SharedDocs\\b.jpg","\\BOILER3\SharedDocs\\c.jpg"];
const imageElement = document.getElementById("image");
let currentIndex = 0;
function changeImage() {
currentIndex = (currentIndex+1) % images.length;
let today = new Date() ;
tempt = today.getHours();
imageElement.src = images[currentIndex]+'?time='+tempt;
}
setInterval(changeImage, 5000); // 5초마다 이미지 변경
</script>
</body>
</html>
공유 설정에 뭔가 문제가 있으려나요?
그대로 복붙하고 제 컴에 있는걸로
이미지경로만 바꿔봤는데 잘 되네요.