ajax加载进度条特效代码.zip资源-CSDN文库

共19个文件

html：5个

css：4个

svg：2个

版权申诉

javascript

jQuery

html5

96 浏览量 2022-11-16 21:21:17 上传评论收藏 286KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

ajax加载进度条特效代码.zip （19个子文件）

ajax加载进度条特效代码

ajax加载进度条特效代码.jpg 73KB

jiaoben2215

css

elusive-webfont.css 22KB

default.css 4KB

loadingbar.css 3KB

style.css 1KB

index5.html 2KB

index4.html 2KB

fonts

Elusive-Icons.woff 74KB

Elusive-Icons.svg 213KB

oxp-demo.ttf 4KB

Elusive-Icons.ttf 41KB

oxp-demo.eot 5KB

oxp-demo.woff 3KB

Elusive-Icons.eot 41KB

oxp-demo.svg 2KB

index.html 2KB

jquery.loadingbar.js 4KB

index2.html 2KB

index3.html 2KB

<!DOCTYPE html> <html lang="en" class="demo5 no-js"> <head> <meta charset="gb2312" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ajax加载进度条特效代码 - 网页模板</title> <link rel="stylesheet" type="text/css" href="css/default.css" />  <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" src="js/jquery.loadingbar.js"></script> <link rel="stylesheet" type="text/css" href="css/style.css" /> <link rel="stylesheet" type="text/css" href="css/loadingbar.css" /> <link rel="stylesheet" type="text/css" href="css/elusive-webfont.css" /> </head> <body class="demo5"> <div class="container"> <div class="header"> <h1>Youtube-like Ajax Loading Bar Demo 5<span>Endless Possibilities</span></h1> </div> <div class="menu"> <a href="index.html">Demo 1</a> <a href="index2.html">Demo 2</a> <a href="index3.html">Demo 3</a> <a href="index4.html">Demo 4</a> <a class="active" href="index5.html">Demo 5</a> </div> <div class="main"> <a href="http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?&tags=everest&tagmode=any&format=json" data-datatype="json" data-type="GET" data-target="#frame" class="reload" id="clickme"><i class="customicon-download-alt"></i> Load Test Data</a> <div class="frame" id="frame"></div> </div> </div> <script type="text/javascript"> $("#clickme").loadingbar({ direction: "down", done: function(data) { $.each( data.items, function( i, item ) { $( "<img/>" ).attr( "src", item.media.m ).prependTo( $("#frame") ); if ( i === 2 ) { return false; } }); } }); </script> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p> <p>来源：<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉