Js achieves the exchange of motion effects, and js achieves the exchange effect.

Js achieves the exchange of motion effects, and js achieves the exchange effect.

This article describes how js achieves the exchange motion effect. Share it with you for your reference. The specific analysis is as follows:

After implementation, click to exchange positions and information about the left side and distance between the two sides.

Key Aspect 1:

var now = s_pic_li[0];for(var i=0; i<s_pic_li.length; i++){s_pic_li[i].onclick = function(){if(this == now) return false;var w = now.offsetWidth;var h = now.offsetHeight;var l = now.offsetLeft;var t = now.offsetTop;var w1= this.offsetWidth;var h1 = this.offsetHeight;var l1 = this.offsetLeft;var t1 = this.offsetTop;startrun(now,{width:w1,height:h1,left:l1,top:t1});startrun(this,{width:w,height:h,left:l,top:t});now=this;}}

Add a click event to each part in a loop to obtain information about both sides of the exchange, and then execute the motion function. The relevant information is used as a parameter.

Finally, run the following code:

<! DOCTYPE html> 
I hope this article will help you design javascript programs.