focus点击样式跳转覆盖

效果

1 .https://codepen.io/ainalem/pen/qBWmxoR
2 .很多就是点击，从一个位置流畅的切换到另一个位置，比如acfun手机客户端，点击对应页签，下面的下划线会走到对应页签下面

    
    
    
    
    
    
    


    

        

            {{c}}
        
        


        
        
        
        

            

                原来的是用到svg来操作，点击路径会变化。
            
            

                现在需要是一边使用transition,一边在里面加动画
            
            

                两个状态，前后位置变化。三个状态：先变大，后变小，回复原状。这样发现在一个transition中间加一个动画，只有先后执行顺序的，现在是先执行动画里面的代码，然后执行transition定义的动画
            
            

                针对第一个问题，先后变化，我调整个动画的延迟执行时间，发现还是没有用，反正就是搞不到一起
            
            

                现在就会出现第二个问题：变化状态无法融合在一起。他们两个始终是独立的，先变化一个状态，在变化另一个东西，而且第二个变化还是在原来的位置变化。所以这么简单的还是要使用animejs那个库。