<!DOCTYPE html><html><head><title></title><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1"><script src='js/test.js'></script><style>* {margin: 0;padding: 0;}body>div {border: 1px solid #05f;width: 560px;overflow: hidden;}body>div>div {position: relative;}div>h2 {border: 1px solid #05f;line-height: 50px;text-align: left;text-indent: 10px;background: -webkit-linear-gradient(top,#fff 50%,#00f 100%);}div>ul {position: absolute;top: 20px;left: 120px;}div>ul>li {list-style-type: none;display: inline-block;text-align: center;width: 80px;line-height: 30px;border: 1px solid #11f;}.title {display: inline-block;}.title img {width: 140px;height: 140px;padding: 20px;background: #fff;}.con {display: inline-block;position: absolute;width: 100000px;top: 20px;left: 182px;z-index: -999;}.con img {width: 120px;height: 120px;margin: 0 3px;}.button {position: absolute;top: 150px;left: 280px;}.button a {display: inline-block;width: 20px;height: 20px;border: 1px solid #00f;text-align: center;cursor: pointer;border-radius: 2px;margin: 0 10px;}.button a:first-of-type {float: left;}.button a:nth-of-type(2) {float: right;}.button span {display: inline-block;width: 10px;height: 10px;border-radius: 50%;border: 1px solid #3a3a3a;background: #aaa;margin: 0 4px;}</style></head><body><div><h2>數碼</h2><ul><li>新品</li><li>極客</li></ul><div><div id="title"><img src="" alt=""></div><div id="con"></div><div id="button"></div></div></div><script>window.onload = function(){load(num);}var oBtn = document.getElementById('button'),aBtn = document.getElementsByTagName('a'),aSpan = oBtn.getElementsByTagName('span'),oTil = document.getElementById('title'),oCon = document.getElementById('con'),aLi = document.getElementsByTagName('li'),str1 = '',str2 = '',spanstr1 = '<a><</a><a>></a>',spanstr2 = '<a><</a><a>></a>',num = 0,snum = 0,aImg1 = ["images/淘寶商品廣告效果/10.jpg","images/淘寶商品廣告效果/11.jpg","images/淘寶商品廣告效果/12.jpg","images/淘寶商品廣告效果/10.jpg"],aImg2 = ["images/淘寶商品廣告效果/2.jpg","images/淘寶商品廣告效果/3.jpg","images/淘寶商品廣告效果/4.jpg","images/淘寶商品廣告效果/5.jpg","images/淘寶商品廣告效果/6.jpg","images/淘寶商品廣告效果/7.jpg","images/淘寶商品廣告效果/8.jpg","images/淘寶商品廣告效果/9.jpg","images/淘寶商品廣告效果/10.jpg"];for(var i=0;i<aImg1.length;i++){str1 += "<img src='"+aImg1[i]+"'/>";}for(var i=0;i<aImg2.length;i++){str2 += "<img src='"+aImg2[i]+"'/>";}for(var i=0;i<Math.ceil(parseFloat(aImg1.length/3));i++){spanstr1 += '<span></span>';}for(var i=0;i<Math.ceil(parseFloat(aImg2.length/3));i++){spanstr2 += '<span></span>';}function load(num){aLi[num].style.background = '#00f';aLi[num].style.color = '#fff';oCon.style.left = '182px';if(num === 0){oCon.innerHTML = str1;oTil.innerHTML = "<img src='"+aImg1[0]+"'/>";oBtn.innerHTML = spanstr1;spancur(0);}if(num === 1){oCon.innerHTML = str2;oTil.innerHTML = "<img src='"+aImg2[0]+"'/>";oBtn.innerHTML = spanstr2;spancur(0);}}function spancur(num){aSpan[num].style.background = "#fff";aSpan[num].style.borderColor = "#00f";}for(var i=0;i<aLi.length;i++){aLi[i].index = i;aLi[i].onmouseover = function(){for(var i=0;i<aLi.length;i++){aLi[num].style.background = 'transparent';aLi[num].style.color = '#000';}num = this.index;load(num);}}aBtn[0].onmousedown = function(){doMove(oCon,'left',20,-200);};</script></body></html>無法獲取a標簽，大家幫忙看看啊
無法獲取a標簽，大家幫忙看看啊
鈴鐺3
2016-10-26 08:20:11
