jquery实现带玻璃流光质感的手风琴特效是一款基于jquery+css3实现的带玻璃流光质感的手风琴特效，分享给大家，具体如下
效果图：
具体代码如下：
html代码：
awesome
words ettrics
go ettrics 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!
inside ettrics 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!
here ettrics 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!

js代码：
var expand = function () { var tile = $('.strips__strip'); var tilelink = $('.strips__strip > .strip__content'); var tiletext = tilelink.find('.strip__inner-text'); var stripclose = $('.strip__close'); var expanded = false; var open = function () { var tile = $(this).parent(); if (!expanded) { tile.addclass('strips__strip--expanded'); tiletext.css('transition', 'all .6s 1s cubic-bezier(0.23, 1, 0.32, 1)'); stripclose.addclass('strip__close--show'); stripclose.css('transition', 'all .6s 1s cubic-bezier(0.23, 1, 0.32, 1)'); expanded = true; } }; var close = function () { if (expanded) { tile.removeclass('strips__strip--expanded'); tiletext.css('transition', 'all 0.15s 0 cubic-bezier(0.23, 1, 0.32, 1)'); stripclose.removeclass('strip__close--show'); stripclose.css('transition', 'all 0.2s 0s cubic-bezier(0.23, 1, 0.32, 1)'); expanded = false; } }; var bindactions = function () { tilelink.on('click', open); stripclose.on('click', close); }; var init = function () { bindactions(); }; return { init: init }; }(); expand.init();
希望本文可以给大家带来启发，帮助大家更好地学习jquery程序设计。