Jquery通过滚动条加载图片资源-CSDN文库

共7个文件

js：4个

htm：1个

css：1个

Jquery

加载图片

5星 · 超过95%的资源需积分: 4 201 浏览量 2012-05-28 17:22:23 上传评论 1 收藏 34KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

Jquery通过滚动条加载图片.rar （7个子文件）

Jquery通过滚动条加载图片

页面图片等元素滚动动态加载技术_files

jquery.min.js 69KB

index_logo.gif 2KB

jquery.scrollLoading.js 1KB

common.css 6KB

show_ads.js 10KB

jquery.scrollLoading.js 1KB

页面图片等元素滚动动态加载技术.htm 3KB

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD> <META content="text/html; charset=utf-8" http-equiv="Content-Type"> <META content="页面图片等元素滚动动态加载技术" http-equiv="description"> <META name="description" content="张鑫旭web前端学习之页面图片等元素滚动动态加载技术实例页面"> <META name="keywords" content="张鑫旭,鑫空间-鑫生活,博客,web前端,css,jQuery,demo页面,学习,"> <META name="author" content="张鑫旭,zhangxixnu"><TITLE>页面图片等元素滚动动态加载技术 » 张鑫旭-鑫空间-鑫生活</TITLE><LINK rel="stylesheet" type="text/css" href="页面图片等元素滚动动态加载技术_files/common.css"> <STYLE> .zxx_test_list{font-size:13px;} .zxx_test_list img{margin-bottom:5px;} </STYLE> <META name="GENERATOR" content="MSHTML 9.00.8112.16443"></HEAD> <BODY> <DIV class="zxx_out_box"> <DIV class="zxx_in_box"> <DIV class="zxx_header"><A href="http://www.zhangxinxu.com/"><IMG class="l" src="页面图片等元素滚动动态加载技术_files/index_logo.gif"></A><SPAN class="zxx_author_time">by zhangxinxu 2010-11-19 10:11</SPAN></DIV> <H1 class="zxx_title">页面图片等元素滚动动态加载技术</H1> <DIV id="zxxMainCon" class="zxx_main_con"> <SCRIPT>var tempHTML = ""; for (var i=1; i<=30; i+=1) { if (i == 6) { tempHTML += '<div class="zxx_test_list scrollLoading" data-url="loaded.html"><div style="padding:100px 0; text-align:center;"><img src="http://www.zhangxinxu.com/study/image/loading.gif" style="margin:0 8px -8px 0;" />加载中...</div></div>'; } else { tempHTML += '<div class="zxx_test_list tc"><img class="scrollLoading" data-url="http://image.zhangxinxu.com/image/study/head/s180/'+i+'.jpeg" src="http://www.zhangxinxu.com/study/image/pixel.gif" width="180" height="180" style="background:url(http://www.zhangxinxu.com/study/image/loading.gif) no-repeat center;" /><br />图片'+i+'(新浪微博提供)</div>'; } } document.getElementById("zxxMainCon").innerHTML = tempHTML; </SCRIPT> </DIV> <DIV class="zxx_footer"> Copyright © <A href="http://www.zhangxinxu.com/">张鑫旭-鑫空间-鑫生活</A>| <A href="http://www.zhangxinxu.com/wordpress/?p=1259">该篇相关文章</A></DIV></DIV></DIV> <SCRIPT type="text/javascript" src="页面图片等元素滚动动态加载技术_files/jquery.min.js"></SCRIPT> <SCRIPT type="text/javascript" src="页面图片等元素滚动动态加载技术_files/jquery.scrollLoading.js"></SCRIPT> <SCRIPT> $(function() { $(".scrollLoading").scrollLoading(); }); </SCRIPT> </BODY></HTML>

评论收藏

内容反馈