2种jQuery 实现刮刮卡效果

其中拖拽刮涂层效果使用jquery UI的draggable方法

以下是源代码：

复制代码 代码如下:
 
 
 
 
 
 
 #keleyi{width:200px;height:20px;position:relative;text-align:center;font-size:12px;overflow:hidden;background:#eee;}
 #keleyi div{position:absolute;top:0px;left:0px;width:100%;height:20px;background:#ccc;}
 #layout2{width:200px;height:20px;position:relative;text-align:center;font-size:12px;overflow:hidden;background:#eee;}
 #layout2 div{position:absolute;top:0px;right:0px;width:100%;height:20px;background:#ccc;}
 
 
 
 
 
 
 说明：不支持IE6！
 

效果一（拖拽灰条）：

效果二（点击灰条）：

这里给大家分享的是十分常用的刮奖的特效代码，希望小伙伴们能够喜欢。