Javascript move the mouse up to the slider to follow the effect

First.

Move the mouse to the corresponding category, and the red triangle below will automatically follow, slowly following.

No matter how many.

JavaScript code:

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 () {// register events for all the slider on the page // products-box-center parent container object var OBJ = document. getelementsbyclassname ('products-B Ox-center '); For (VAR I = 0; I <obj. length; I ++) {try {var base = OBJ [I]. getelementsbyclassname ('products-box-center-title') [0]; // obtain the title var elems = base. getelementsbyclassname ('products-items-title'); For (var j = 0; j <elems. length; j ++) {var ELEM = elems [J]; ELEM. onmousemove = function () {// obtain the parent container var baseelem = this of the parent container of the current object. parentelement. parentelement; var baseindex = indexof (OBJ, baseelem) + 1; // obtain the coordinates of the current object var left = This. offsetl EFT; // obtain the corresponding slider object var slider =$ ('products-triangle-'+ baseindex); // change the slider coordinate slider. style. left = left + "PX"; // Changes the color of the current object and other objects. This. style. color = "red"; // obtain all elements under the current parent container 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" ;};}} catch (e) {alert (e );}};}

HTML code:

<Div class = "products-box-center"> <Div class = "products-box-center-title"> <Div class = "products-items-title products-focus- text "> 
The above HTML is part. You can use the El expression to loop and try more...
 

 
It takes only one morning to complete...