使用遞迴快速顯示圖片
<br /><!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>untitled</title> <style> li { float: left; list-style: none; margin: 0 25px 25px 0; } </style> </head> <body> <ul> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> <li><img src="http://d3pr5r64n04s3o.cloudfront.net/002_Tut_WarmDesign/title_image.jpg" /> </li> </ul> <p style="clear: both; display: none;"> <a href="#"> Show Images </a> </p> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <script> (function() { $('p').show(); var lis = $('li').hide(); $('a').click(function() { var i = 0; (function displayImages() { lis.eq(i++).fadeIn(200, displayImages); })(); }); })(); </script> </body> </html><br />
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
