用css和jquery圆圈动画

我必须设计一个动画。上下有两个半圆。当我们悬停该部分时，这个圆圈就会生成动画。用css和jquery圆圈动画

请参阅图像：

的jsfiddle链接： - https://jsfiddle.net/bharat_negi/bbdbbdn3/

HTML代码： -

<div class="col-md-12 contant-area homeClass"> 
    <div class="col-md-3 col-sm-6"> 
    <div class="homeinfo"> 
    <h2>INNOVATION</h2> 
    <div class="infoIco"> 
    <div class="topCover"></div> 
    <div class="clearfix"></div> 
    <div class="circle circle1"> 
     <i><img src="images/whyinn-icon.png" alt=""></i> 
    </div> 
    <div class="clearfix"></div> 
    <div class="footCover"></div> 
    <div class="fullCircle"></div> 
    </div> 
    <p>We know digital innovation is the key to future growth.</p> 
</div>

来源

2017-08-30 Bharat Negi

对你有好处，你有一个真正的问题吗？ – Liam

请花一些时间阅读帮助页面，尤其是名为[“我可以询问什么主题？”]（http://stackoverflow.com/help/on-topic）和[“应该提供什么类型的问题我避免问？“]（http://stackoverflow.com/help/dont-ask）。更重要的是，请阅读[Stack Overflow问题清单]（http://meta.stackexchange.com/q/156810/204922）。您可能还想了解[最小，完整和可验证示例]（http://stackoverflow.com/help/mcve）。 –

有时CSS不是Job的最佳工具。 SVG现在得到浏览器的广泛支持，并且可以很容易地进行动画制作。您甚至可以使用设计包来制作SVG，然后查看SVG源以放置CSS选择器等，然后为其设置动画。 – Keith

看看这个例子中，我HAV创建E：

https://jsfiddle.net/bbdbbdn3/1/

它不会回答你的问题，但希望能帮助你找到一个解决方案。

本示例中“动画”的工作方式是通过一个垂直居中的元素（本例中为.curtain）填充父元素并具有与父级背景匹配的背景色。然后在盘旋.curtains高度动画为0

来源

2017-08-30 10:53:08

用css和jquery圆圈动画

回答

相关问题