function changeCoord(id, left) { $$(id).style.left = left; } function $$(id) { return document.getElementById(id); } function $$$(id) { return document.getElementsByClassName(id)[0]; } function indexOf(arry, obj) { for (var i = 0; i < arry.length; i++) { if (obj == arry[i]) { return i; } }; } window.onload = function() { //給頁面上所有的滑塊注冊事件 //products-box-center 父容器對象
var obj = document.getElementsByClassName('products-box-center'); for(var i=0;i<obj.length;i++){ try{ var base=obj[i].getElementsByClassName('products-box-center-title')[0]; //取得每一項(xiàng)標(biāo)題 var elems=base.getElementsByClassName('products-items-title'); for(var j=0;j<elems.length;j++){ var elem=elems[j]; elem.onmousemove=function(){ //獲得當(dāng)前對象的父容器的父容器 var baseElem=this.parentElement.parentElement; var baseIndex=indexOf(obj,baseElem)+1;
//獲得當(dāng)前對象的坐標(biāo) var left = this.offsetLeft;
//獲得對應(yīng)的滑塊對象 var slider=$$('products-triangle-'+baseIndex);
//改變滑塊的坐標(biāo) slider.style.left = left + "px"; //改變當(dāng)前對象和其他對象的顏色 this.style.color = "red"; //獲取當(dāng)前父容器下面的所有元素 var notes=this.parentElement.getElementsByClassName('products-items-title'); for(var k=0;k<notes.length;k++){ if(this!=notes[k]) notes[k].style.color="#666"; }