html+js图片轮播包含背景音乐

来源：互联网发布：如何查看电脑远程端口编辑：程序博客网时间：2024/05/20 03:45

<!DOCTYPE html><html> <head>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    <title>无标题文档</title>    <style type="text/css">        #tab {    overflow: hidden;    width: 100%;    height: 250px;    position: relative;    float: left;} #tab>img:not(:first-child) {    display: none;}    </style>  <script>        var interval;        var pos = 0;        window.onload = function() {            var images = document.getElementsByTagName('img');            var tab = document.getElementById("tab");            tab.onmouseover = function() {                clearInterval(interval);            }            tab.onmouseout = function() {                run(images);            }            run(images);        }        var run = function(images) {            interval = setInterval(function() {                images[pos].style.display = 'none';                pos = ++pos == images.length ? 0 : pos;                images[pos].style.display = 'inline';            }, 3000);        }    </script></head> <body><audio src="music/花粥 - 一腔诗意喂了狗.mp3" autoplay="autoplay"></audio>    <div id="tab">        <a href="http://www.iiover.com"><img src="img/01.jpg" width="100%" height="250" /></a>        <a href="http://www.iiover.com"><img src="img/02.jpg" width="100%" height="250" /></a>        <a href="http://www.iiover.com"><img src="img/03.jpg" width="100%" height="250" /></a>    </div></body> </html>

阅读全文

0 0