deck-of-cards 介绍
deck-of-cards是一款非常炫酷的html5扑克牌卡片动画类库。它使用纯js和css3来实现洗牌,发牌等 功能 。 在这 个 效果 的演示中,扑克牌使用SVG来制作,共给出了5种 功能 的演示 效果 。??
安装
npm install deck-of-cards
例子
<html>
<head>
<title>Cards</title>
<link rel="stylesheet" href="node_modules/deck-of-cards/example/example.css">
</head>
<body>
<script src="node_modules/deck-of-cards/ dis t/deck.min.js"></script>
<div id="container"></div>
<script>
var $container = document.getElementById('container');
// create Deck
var deck = Deck();
// add to DOM
deck.mount($container);
deck.cards.forEach(function (card,i) {
card.setSide(Math.random() < 0.5 ? 'front' : 'back');
// explode
card.animat eto ({
delay: 1000 + i * 2,// wait 1 second + i * 2 ms
duration: 500,
ease: 'quartOut',
x: Math.random() * window.innerWidth - window.innerWidth / 2,
y: Math.random() * window.innerHeight - window.innerHeight / 2
});
});
</script>
</body>
</html>
网站地址 : https://deck.of.cards
GitHub: https://github.com/deck-of-cards/deck-of-cards
网站描述: 一款非常炫酷的HTML5扑克牌卡片动画类库
deck-of-cards官方网站
官方网站: https://deck.of.cards
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。