<!DOCTYPE?html>
<html>
????<head>
????????<meta?charset="utf-8"?/>
????????<title>css3輪播圖特效</title>
????????<link?rel="stylesheet"?href="css/style.css"?/>
????</head>
????<body>
????????<div?class="pic-box"?id="pic-box">
????????????<ul?id="pic-ul">
????????????????<li><img?src="img/1.jpg"?alt=""?/></li>
????????????????<li><img?src="img/2.jpg"?alt=""?/></li>
????????????????<li><img?src="img/3.jpg"?alt=""?/></li>
????????????????<li><img?src="img/4.jpg"?alt=""?/></li>
????????????????<li><img?src="img/5.jpg"?alt=""?/></li>
????????????????<li><img?src="img/6.jpg"?alt=""?/></li>
????????????</ul>
????????????<!--底部進(jìn)度提示-->
????????????<div?class="control">
????????????????<em?class="now"></em>
????????????????<em></em>
????????????????<em></em>
????????????????<em></em>
????????????????<em></em>
????????????????<em></em>
????????????</div>
????????</div>
????????
????????<script>
????????????var?getbox?=?document.getElementById("pic-box");
????????????//alert(getbox.nodeName);
????????????var?getul?=?document.getElementById("pic-ul");
????????????//alert(getul.nodeType);
????????????//alert(getul.nodeValue);
????????????//alert(getul.nodeName);
????????????var?getem?=?document.getElementsByTagName("em");
????????????//alert(getem[0].className);
????????????//alert(getem.length);
????????????var?index?=?0,timer?=?null;
????????????
????????????function?autoplay(){
????????????????timer?=?setInterval(function(){
????????????????????index++;
????????????????????if(index?>=?getem.length){
????????????????????????index?=?0;
????????????????????}
????????????????????changePic(index);
????????????????},3000)
????????????}
????????????autoplay();
????????????function?changePic(number){
????????????????getul.style.marginLeft?=?-800?*?number?+?"px";
????????????????for?(var?i?=?0;i?<?getem.length;i++)?{
????????????????????getem[i].className?=?"";
????????????????}
????????????????getem[number].className?=?"now";
????????????}
????????????getbox.onmouseout?=?function(){
????????????????autoplay();
????????????????
????????????}
????????????
????????????getbox.onmouseover?=?function(){
????????????????clearInterval(timer);
????????????}
????????????for(var?i?=?0;i?<?getem.length;i++){
????????????????getem[i].id?=?i;
????????????????getem[i].onmouseover?=?function(){
????????????????????changePic(this.id);
????????????????}
????????????}
????????</script>
????</body>
</html>里面的getbox.onmouseout = function(){ autoplay()};?? 要這樣寫(xiě)才有效果，不然下面的onmouseover都會(huì)失效可以我以前都是寫(xiě)成getbox.onmouseout = autoplay()?? 可以不行了，這是什么鬼問(wèn)題
一個(gè)js的鼠標(biāo)事件問(wèn)題
西蘭花偉大炮
2017-03-09 22:18:34
