成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

抽獎跑馬燈

ernest.wang / 1946人閱讀

摘要：最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下代碼云豆云豆云豆抽獎已抽獎云豆云豆云豆云豆云豆代碼

最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下

html代碼


    
    
        
  • 20云豆
    • 
        
  • 50云豆
    • 
        
  • 100云豆
    • 
        
  • 抽   獎
    • 
        
  • 已 抽 獎
    • 
        
  • 1000云豆
    • 
        
  • 2000云豆
    • 
        
  • 5000云豆
    • 
        
  • 10000云豆
    • 
        
  • 20000云豆
    •

css代碼

.lottery .lottery-ul{position:relative;width:360px;height:360px;margin:0;padding:0;float:left;background:#ffeabc;}
.lottery .lottery-ul li {width:120px;height:120px;line-height:90px;color:#ff5152;;text-align:center;list-style-type: none;}
.lottery .lottery-ul li .beans{color:#ff5152;;font-size:20px;font-weight:bold;}
.lottery .lottery-ul li.lottery-unit-1{position:absolute;top:0;left:0;background:url("http://www.sinacloud.com/static/special/image/lottery_bg1.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-2{position:absolute;top:0;left:120px;background:url("http://www.sinacloud.com/static/special/image/lottery_bg2.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-3{position:absolute;top:0;left:240px;background:url("http://www.sinacloud.com/static/special/image/lottery_bg1.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-4{position:absolute;top:120px;left:240px;background:url("http://www.sinacloud.com/static/special/image/lottery_bg2.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-5{position:absolute;top:240px;left:240px;background:url("http://www.sinacloud.com/static/special/image/lottery_bg1.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-6{position:absolute;top:240px;left:120px;background:url("http://www.sinacloud.com/static/special/image/lottery_bg2.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-7{position:absolute;top:240px;left:0;background:url("http://www.sinacloud.com/static/special/image/lottery_bg1.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-unit-8{position:absolute;top:120px;left:0;background:url("http://www.sinacloud.com/static/special/image/lottery_bg2.png") 0 0 no-repeat;}
.lottery .lottery-ul li.active{
    background:url("http://www.sinacloud.com/static/special/image/lottery_bg_active.png") 0 0 no-repeat;}
.lottery .lottery-ul li.lottery-btn{position:absolute;top:120px;left:120px;width:120px;height:120px;background:#ffeabc;}
.lottery .lottery-ul li.lottery-btn a{display:inline-block;width:120px;height:120px;line-height:120px;text-align:center;font-size:30px;color:#fff;text-decoration:none;background:#fe8145;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}
.lottery .lottery-ul li.has-lottery a{padding:0;border:none;}
.hide{display:none;}

js代碼

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/49806.html

相關(guān)文章

  • 抽獎跑馬燈

    摘要：最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下代碼云豆云豆云豆抽獎已抽獎云豆云豆云豆云豆云豆代碼 最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下showImg(https://segmentfault.com/img/bVtGTX); html代碼 20云豆 50云豆 100云豆 ...

    Sleepy 評論0 收藏0

  • 抽獎跑馬燈

    摘要：最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下代碼云豆云豆云豆抽獎已抽獎云豆云豆云豆云豆云豆代碼 最近做了一個春節(jié)活動，里面有個抽獎活動，做一個跑馬燈效果，示例如下showImg(https://segmentfault.com/img/bVtGTX); html代碼 20云豆 50云豆 100云豆 ...

    hedzr 評論0 收藏0

  • JavaScript “跑馬燈”抽獎活動代碼解析與優(yōu)化（一）

    摘要：最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。這里主要是來寫寫自己的優(yōu)化過程。所以寫代碼的時候一定要注意一些小細(xì)節(jié)哈。。。在以后，其返回的元素順序等同于在中出現(xiàn)的先后順序。盡管是一個數(shù)組。這時從加入執(zhí)行隊(duì)列到加入執(zhí)行隊(duì)列中間時間間隔是。 最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。上篇文章已經(jīng)分享過html和css 的相關(guān)知識。這篇文章主要分享一些 JavaScript 相關(guān)的知識。這幾天在...

    isaced 評論0 收藏0

  • JavaScript “跑馬燈”抽獎活動代碼解析與優(yōu)化（一）

    摘要：最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。這里主要是來寫寫自己的優(yōu)化過程。所以寫代碼的時候一定要注意一些小細(xì)節(jié)哈。。。在以后，其返回的元素順序等同于在中出現(xiàn)的先后順序。盡管是一個數(shù)組。這時從加入執(zhí)行隊(duì)列到加入執(zhí)行隊(duì)列中間時間間隔是。 最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。上篇文章已經(jīng)分享過html和css 的相關(guān)知識。這篇文章主要分享一些 JavaScript 相關(guān)的知識。這幾天在...

    MRZYD 評論0 收藏0

  • JavaScript “跑馬燈”抽獎活動代碼解析與優(yōu)化（一）

    摘要：最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。這里主要是來寫寫自己的優(yōu)化過程。所以寫代碼的時候一定要注意一些小細(xì)節(jié)哈。。。在以后，其返回的元素順序等同于在中出現(xiàn)的先后順序。盡管是一個數(shù)組。這時從加入執(zhí)行隊(duì)列到加入執(zhí)行隊(duì)列中間時間間隔是。 最近的項(xiàng)目中做了一個跑馬燈的抽獎特效插件。上篇文章已經(jīng)分享過html和css 的相關(guān)知識。這篇文章主要分享一些 JavaScript 相關(guān)的知識。這幾天在...

    HelKyle 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<