jQuery实现带玻璃流光质感的手风琴特效是一款基于jQuery+CSS3实现的带玻璃流光质感的手风琴特效,分享给大家,具体如下
效果图:

具体代码如下:
html代码:
<section class="strips">
<article class="strips__strip">
<div class="strip__content">
<h1 class="strip__title" data-name="Lorem">Awesome</h1>
</div>
</article>
<article class="strips__strip">
<div class="strip__content">
<h1 class="strip__title" data-name="Ipsum">Words</h1>
<div class="strip__inner-text">
<h2>Ettrics</h2> <script src="http://www.w2bc.com/scripts/2bc/_gg_980_90.js" type="text/javascript"></script>
<p>
<a href="#" target="_blank"><i class="fa fa-qq"></i></a>
</p>
</div>
</div>
</article>
<article class="strips__strip">
<div class="strip__content">
<h1 class="strip__title" data-name="Dolor">Go</h1>
<div class="strip__inner-text">
<h2>Ettrics</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia sapiente deserunt consectetur, quod reiciendis corrupti quo ea aliquid! Repellendus numquam quo, voluptate. Suscipit soluta omnis quibusdam facilis, illo voluptates odit!</p>
<p>
<a href="#" target="_blank"><i class="fa fa-weibo"></i></a>
</p>
</div>
</div>
</article>
<article class="strips__strip">
<div class="strip__content">
<h1 class="strip__title" data-name="Sit">Inside</h1>
<div class="strip__inner-text">
<h2>Ettrics</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia sapiente deserunt consectetur, quod reiciendis corrupti quo ea aliquid! Repellendus numquam quo, voluptate. Suscipit soluta omnis quibusdam facilis, illo voluptates odit!</p>
<p>
<a href="#" target="_blank"><i class="fa fa-weixin"></i></a>
</p>
</div>
</div>
</article>
<article class="strips__strip">
<div class="strip__content">
<h1 class="strip__title" data-name="Amet">Here</h1>
<div class="strip__inner-text">
<h2>Ettrics</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia sapiente deserunt consectetur, quod reiciendis corrupti quo ea aliquid! Repellendus numquam quo, voluptate. Suscipit soluta omnis quibusdam facilis, illo voluptates odit!</p>










