這個小項目（卡片秀）是一個卡片抽獎特效，用開源項目這樣的詞語讓我多少有些羞愧，畢竟作為一個涉世未深的小伙子，用項目的標準衡量還有很大差距。不過該案例采用 jQuery 插件方式編寫，提供配置參數(shù)并且做了瀏覽器兼容優(yōu)化，整體而言作為一個小項目也不為過。目前正在持續(xù)更新。
話不多少，先上地址：https://github.com/nzbin/CardShow/tree/master
當然，博主寫這篇文章不是為了炫耀這個 Demo，而是交流 jQuery 插件的編寫以及這一項目中遇到的各種問題?，F(xiàn)在的插件還有很多 bug 以及不完善的地方包括一些代碼的冗余，后期會進行更細致的拆分組裝等。
首先說一下這個項目的起因，博主最近接到了公司安排的一個抽獎頁面，因為時間倉促以及其它原因，最后簡單實現(xiàn)了功能并且添加了一些動畫效果。但是最初看到設計圖以卡片形式展示用戶數(shù)據(jù)的時候，我就想到了能否做的稍微炫酷一點，隨后便一直在構思。比如卡片的飛出、隨機排列、自動及手動抽取以及翻轉顯示等效果。事實證明，把想法變現(xiàn)實會遇到很多的問題。大家可以點擊 CardShow 查看自動抽卡的效果。目前的效果基本實現(xiàn)了我當初的構思?？ㄆ某槿⌒Ч饕譃?strong>自動抽及手動抽兩種。后期會添加卡片拖動的功能。我希望大家能夠下載源碼修改參數(shù)來查看效果，并提出寶貴意見，以便博主可以及時作出修改，大家的支持就是我前進的最大動力。
以下是我在寫插件時遇到的問題以及解決的問題，大概包括 jQuery 插件編寫、modernizr 使用、css3 動畫、transitionend 事件、洗牌算法、相鄰不重復隨機數(shù)、獲取 transform 的值、call() 的深入理解、setTimeout 的堵塞等等，每一塊拿出來都可以單獨寫一篇文章，這篇文章只是簡單介紹，之后也會就某一部分做深入探討。
