微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

paper-collapse

编程之家收集整理的这个编程导航主要介绍了paper-collapse编程之家,现在分享给大家,也给大家做个参考。

paper-collapse 介绍

paper-collapse是一款谷歌Material Design风格卡片式手风琴特效的jQuery插件。该手风琴效果的每一个手风琴项都是一张卡片,点击时卡片会相应的伸展和收缩,时尚美观。

paper-collapse使用

1、引入

<link rel="stylesheet" href="css/paper-collapse.min.css">

<script type="text/JavaScript" src="js/jquery.min.js"></script>

<script type="text/JavaScript" src="paper-collapse.js"></script>

2、html

div class="collapse-card">

<div class="collapse-card__heading">

<div class="collapse-card__title">

<i class="fa fa-question-circle fa-2x fa-fw"></i>

<!-- 标题文本-->

</div>

</div>

<div class="collapse-card__body">

<!-- 手风琴卡片中的文本内容 -->

</div>

</div>

3、初始化

<script>

$(function () {

$(".collapse-card").paperCollapse();

});

</script>

网站地址:http://www.google.com/design/

GitHub:https://github.com/alexander-ruehle/paper-collapse

网站描述:一款谷歌Material Design风格卡片式手风琴特效的jQuery插件

paper-collapse

官方网站:http://www.google.com/design/

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。