- Error loading image: http://monc.se/galleria/demo/img/flowing-rock.jpg
- Error loading image: http://monc.se/galleria/demo/img/stones.jpg
- Error loading image: http://monc.se/galleria/demo/img/grass-blades.jpg
- Error loading image: http://monc.se/galleria/demo/img/ladybug.jpg
- Error loading image: http://monc.se/galleria/demo/img/lightning.jpg
- Error loading image: http://monc.se/galleria/demo/img/lotus.jpg
- Error loading image: http://monc.se/galleria/demo/img/mojave.jpg
- Error loading image: http://monc.se/galleria/demo/img/pier.jpg
- Error loading image: http://monc.se/galleria/demo/img/sea-mist.jpg
|
通过简单的五个步骤就可以实现图片画廊,这就是jQuery插件Galleria能够为我们做的。 1.下载最新版本的。 2.下载和样式文件。 3.添加以下代码到页面的<head></head>头部中:
程序代码
<link href="galleria.css" rel="stylesheet" type="text/css" media="screen"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.galleria.js"></script> <script type="text/javascript"> jQuery(function($) { $('ul.gallery').galleria(); }); </script>
程序代码
<ul class="gallery"> <li><img src="i/i01.jpg" title="A caption" alt="Image01"></li> </ul>
程序代码
<ul class="gallery"> <li><img class="noscale" src="i/01.jpg" title="A caption" alt="Image01"></li> </ul>
程序代码
<ul class="gallery"> <li><a href="i/01.gif" title="A caption"><img src="i/01_thumb.jpg" alt="Image01"></a></li> </ul>