<html><head> <meta charset="utf-8"> <style> body { margin: 0; padding: 0; } img { width: 294px; height: 121px; border: 0px; position: relative; top: 0px; left: 0px; z-index: 0; } .contain { object-fit: contain; font-family: 'object-fit: contain;'; /*IE対策*/ } .text { position: absolute; bottom: 5px; left: 5px; z-index: 1; font-size: 36px; text-shadow: white 1px 1px 0px, white -1px 1px 0px, white 1px -1px 0px, white -1px -1px 0px; } </style></head><img id='img' src='./image/straw-field-hair-nature-157728.jpeg' class='contain'><div class='text' id='text'> DATE</div></img><script src="./js/ofi.js"></script><script src="./imageList.js"></script><script>
if (window.File && window.FileReader && window.FileList && window.Blob) { // Great success! All the File APIs are supported.} else { alert('The File APIs are not fully supported in this browser.');}
var dir='../image/'; /*var imgList=["04c4ed7ddd30fa33e3fe5b11549ba416.jpg"];*/ objectFitImages(); function foo(x) { return (x < 10) ? '0' + x : x; } function clock() { var now = new Date(); var h = now.getHours(); var m = now.getMinutes(); var s = now.getSeconds(); var t = foo(h) + ':' + foo(m); document.getElementById('text').innerText = t; } setInterval(clock, 10000); window.onload = clock;
function UpdatedBeauty(){ var r = Math.random()*(imgList.length-1); var index=Math.round(r); console.log(Math.round(r)); document.getElementById('img').src=dir + imgList[index]; } setInterval(UpdatedBeauty, 60000); </script> </html>