欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)文字向上輪播功能

 更新時(shí)間:2017年01月13日 10:42:38   作者:帶阿貍?cè)ヂ眯? 
本文主要分享了javascript實(shí)現(xiàn)向上文字輪播功能的示例代碼。具有一定的參考價(jià)值,下面跟著小編一起來(lái)看下吧

話(huà)不多說(shuō),請(qǐng)看實(shí)現(xiàn)代碼:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <style>
 *{
 margin:0;
 padding:0;
 }
 .lunbo{
 position: relative;
 width: 600px;
 height: 50px;
 border:1px solid red;
 overflow: hidden;
 }
 ul{
 position:absolute;
 left: 0;
 top:0;
 width: 600px;
 height: auto;
 }
 ul li{
 width: 600px;
 height: 50px;
 line-height: 50px;
 font-size:20px;
 color:#333;
 text-align: center
 }
 </style>
</head>
<body>
 <div class="lunbo">
 <ul>
 <li>人生在世須盡歡 莫使金樽空對(duì)月</li>
 <li>我寄愁心與明月,隨風(fēng)直到夜郎西</li>
 <li>不是花中偏愛(ài)菊,此花開(kāi)盡更無(wú)花</li>
 <li>辛苦遭逢起一經(jīng),干戈寥落四周星</li>
 <li>山河破碎風(fēng)飄絮,身世浮沉雨打萍。</li>
 <li>惶恐灘頭說(shuō)惶恐,零丁洋里嘆零丁。</li>
 <li>人生自古誰(shuí)無(wú)死?留取丹心照汗青。</li>
 </ul>
 </div>
<script src="http://cdn.bootcss.com/jquery/2.2.2/jquery.js"></script>
<script>
 function lunbo(id,height){
  var ul=$(id);
  var liFirst=ul.find('li:first');
  $(id).animate({top:height}).animate({"top":0},0,function(){
  var clone=liFirst.clone();
  $(id).append(clone);
  liFirst.remove();
  })
 }
 setInterval("lunbo('ul','-50px')",3000)
</script>
</body>
</html>

以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,同時(shí)也希望多多支持腳本之家!

相關(guān)文章

  • Bootstrap下拉菜單Dropdowns的實(shí)現(xiàn)代碼

    Bootstrap下拉菜單Dropdowns的實(shí)現(xiàn)代碼

    這篇文章主要為大家詳細(xì)介紹了Bootstrap下拉菜單Dropdowns的實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-03-03
  • JavaScript如何將base64圖片轉(zhuǎn)化為URL格式

    JavaScript如何將base64圖片轉(zhuǎn)化為URL格式

    這篇文章主要給大家介紹了關(guān)于JavaScript如何將base64圖片轉(zhuǎn)化為URL格式的相關(guān)資料,Base64是一種編碼方式,而不是真正的加密方式,即使算Base64也僅用作一個(gè)簡(jiǎn)單的加密來(lái)保護(hù)某些數(shù)據(jù),而真正的加密通常都比較繁瑣,需要的朋友可以參考下
    2023-07-07
  • js實(shí)現(xiàn)帶進(jìn)度條提示的多視頻上傳功能

    js實(shí)現(xiàn)帶進(jìn)度條提示的多視頻上傳功能

    這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)帶進(jìn)度條提示的多視頻上傳功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2017-07-07
  • js 圖片隨機(jī)不定向浮動(dòng)的實(shí)現(xiàn)代碼

    js 圖片隨機(jī)不定向浮動(dòng)的實(shí)現(xiàn)代碼

    這篇文章介紹了js圖片隨機(jī)不定向浮動(dòng)的實(shí)現(xiàn)代碼,有需要的朋友可以參考一下
    2013-07-07
  • ES6 Promise對(duì)象概念與用法分析

    ES6 Promise對(duì)象概念與用法分析

    這篇文章主要介紹了ES6 Promise對(duì)象概念與用法,簡(jiǎn)單分析了Promise對(duì)象的基本狀態(tài)與三種重要方法,并結(jié)合實(shí)例形式給出相關(guān)使用技巧,需要的朋友可以參考下
    2017-04-04
  • canvas紅包照片實(shí)例分享

    canvas紅包照片實(shí)例分享

    本文主要分享了canvas紅包照片的實(shí)例代碼,具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧
    2017-02-02
  • JavaScript判斷前綴、后綴是否是空格的方法

    JavaScript判斷前綴、后綴是否是空格的方法

    這篇文章主要介紹了JavaScript判斷前綴、后綴是否是空格的方法,涉及javascript操作字符串的正則替換、判斷與屬性操作技巧,需要的朋友可以參考下
    2015-04-04
  • iframe實(shí)現(xiàn)與父頁(yè)面跨域隔離的JavaScript?代碼沙箱

    iframe實(shí)現(xiàn)與父頁(yè)面跨域隔離的JavaScript?代碼沙箱

    這篇文章主要介紹了使用iframe實(shí)現(xiàn)與父頁(yè)面跨域隔離的JavaScript代碼沙箱,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-05-05
  • 微信小程序返回上一級(jí)頁(yè)面的實(shí)現(xiàn)代碼

    微信小程序返回上一級(jí)頁(yè)面的實(shí)現(xiàn)代碼

    這篇文章主要介紹了微信小程序返回上一級(jí)頁(yè)面的實(shí)現(xiàn)代碼,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2020-06-06
  • LazyLoad 延遲加載(按需加載)

    LazyLoad 延遲加載(按需加載)

    大型網(wǎng)站往往很矛盾,想用戶(hù)在首頁(yè)看到更多東西,又不想浪費(fèi)太多服務(wù)器流量。比如一個(gè)有3屏的首頁(yè)。可能50%的用戶(hù)進(jìn)首頁(yè)的目的是點(diǎn)擊首頁(yè)的連接,到子頁(yè)面。
    2010-05-05

最新評(píng)論