jQuery AD Gallery相册插件

来源:http://coffeescripter.com/code/ad-gallery/

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="jquery.ad-gallery.css">  <script type="text/javascript"

src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js%22%3E%3C/script>
<script type="text/javascript" src="jquery.ad-gallery.js?rand=995"></script>
<script type="text/javascript">
$(function() {
    $('img.image1').data('ad-desc', 'Whoa! This description is set through elm.data("ad-desc") instead

of using the longdesc attribute.<br>And it contains <strong>H</strong>ow <strong>T</strong>o

<strong>M</strong>eet <strong>L</strong>adies... <em>What?</em> That aint what HTML stands for?

Man...');
    $('img.image1').data('ad-title', 'Title through $.data');
 
    var galleries = $('.ad-gallery').adGallery({
    start_at_index: 1,
    callbacks: {
        afterImageVisible: function() {
                        //上传完成后执行,下面例子为弹出当前图片的ID
            alert($('img.imgWH:eq(' + this.current_index + ')').attr("id"));
    }//备注:这里不要加“,”,否则在IE6下会出错
    }
   });
    $('#switch-effect').change(
      function() {
        galleries[0].settings.effect = $(this).val();
        return false;
      }
    );
    $('#toggle-slideshow').click(
      function() {
        galleries[0].slideshow.toggle();
        return false;   
      }
    );
});
</script>

<title>A demo of AD Gallery</title>
</head>
<body text-aligh:center;>

    <div id="gallery" class="ad-gallery">
      <div class="ad-nav">
        <div class="ad-thumbs">
          <ul class="ad-thumb-list">
           
          <li>
              <a href="images/1.jpg" >
                <img src="images/t/1.jpg"  id="p1" class="imgWH">
              </a>
            </li>
           
            <li>
              <a href="images/t/2.jpg" >

                <img src="images/t/2.jpg"  id="p2" class="imgWH">
              </a>
            </li>
         
            <li>

              <a href="images/3.jpg">
                <img src="images/t/3.jpg" id="p3" class="image7 imgWH">
              </a>
            </li>
            <li>
              <a href="images/4.jpg">
                <img src="images/t/4.jpg" id="p4" class="image8 imgWH">
              </a>
            </li>
          
          </ul>
        </div>
      </div>
     <div class="ad-image-wrapper"></div>
</div>

</body>
</html>

你可能感兴趣的:(gallery)