jQuery箭头切换图片

• 布局
• 3d位移 变形原点
• jQuery

transform：translate3d（x,y,z）；

       x 代表横向坐标移向量的长度

       y 代表纵向坐标移向量的长度

       z 代表Z轴移向量的长度 取值不可为百

scale（） 缩放

transform-origin：0 50%；

       top left | left top 等价于 0 0

       top | top center | center top 等价于 50% 0

       right top | top right 等价于 100% 0

       left | left center | center left 等价于 0 50%

       center | center center 等价于 50% 50%（默认值）

       right | right center | center right 等价于 100% 50%

       bottom left | left bottom 等价于 0 100%

       bottom | bottom center | center bottom 等价于 50% 100%

       bottom right | right bottom 等价于 100% 100%

 left,center right是水平方向取值，对应的百分值为left=0%;center=50%;right=100%

 top center bottom是垂直方向的取值，其中top=0%;center=50%;bottom=100%；

HTML 部分

     
     
    
      
        
       
            
        
            
        
            
        
            
        
            
        
            
        
            
        
        
       
    
      
        
      <    
      >
     

CSS 部分

JavaScript 部分

此文到此结束

 

 

此文参考 http://www.w3cplus.com/css3/css3-3d-transform.html