Javascript鼠标移动上去小三角形滑块缓慢跟随效果

先来一张截图

鼠标移动到对应的分类，下面的红色小三角形就会自动跟随，缓慢的跟随。不管有多少个都可以java描述语言代码：复制代码代码如下：函数changeCoord(id，左侧){ $ $(id)。风格。左=左；}函数$ $(id){返回文档。getelementbyid(id)；}函数$ $ $(id){返回文档。getelementsbyclassname(id)[0]；}函数indexOf(arry，obj){ for(var I=0；长度；I){ if(obj==arry[I]){ return I；} };} window.onload=function() { //给页面上所有的滑块注册事件//产品-盒子-中心父容器对象var obj=文档。getelementsbyclassname('产品-盒子-中心');for(var I=0；iobj . lentigi){ 0尝试{ var base=obj[i].getElementsByClassName(' products-box-center-title ')[0]；//取得每一项标题var elems=base。getelementsbyclassname('产品-项目-标题')；for(var j=0；jelems . lendej){ var elem=elems[j]；elem.onmousemove=function(){ //获得当前对象的父容器的父容器var baselem=this。父元素。父元素；var baseIndex=indexOf(obj，baselem)1；//获得当前对象的坐标var left=this.offsetLeft//获得对应的滑块对象var slider=$ $(' products-triangle-' base index)；//改变滑块的坐标滑块。风格。left=left ' px//改变当前对象和其他对象的颜色这个。风格。颜色='红色'；//获取当前父容器下面的所有元素var notes=这个。parentelement。getelementsbyclassname('产品-项目-标题')；for(var k=0；节长；k ){ if(这个！=notes[k])notes[k]。风格。color=' # 666} };} } catch(e){ alert(e)；} };} html代码：复制代码代码如下H3最新商品/h3/div class='产品-项目-标题H3笔记本/h3/div class='产品-项目-标题H3数码影音/h3/div class='产品-项目-标题H3配件/h3/div class='产品-项目-标题H3办公打印/H3/div class=' products-bottom-triangle ' id=' products-triangle-$ { index。count } ' b class=' triangle '/div/div class=' products-box-panel ' div class=' products-item ' ul c : foreach begin=' 1 ' end=' 10 '阿利href=' # ' img src=' http : img/PC。jpg '/a div class=' p-name ' a href=' # ' LG IPS 237 l '英寸英寸秒每秒英寸数显示器/a/div class=' p-price ' span1299.00/span/div/Li/c : foreach/ul/div/div/div上面的超文本标记语言是部分，可以用埃尔表达式循环下，多搞几个。 一个上午才做好。