zoukankan      html  css  js  c++  java
  • jquery类Slideshow Gallery

    演示地址:http://www.corange.cn/demo/3727/index.html
    http://www.corange.cn//uploadfiles/1117_95849.jpg

    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Apple-like Slideshow Gallery-www.corange.cn</title>

    <link rel="stylesheet" type="text/css" href="demo.css" />

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="script.js"></script>

    <!--[if lte IE 7]>
    <style type="text/css">
    ul li{
    display:inline;
    /*float:left;*/
    }
    </style>
    <![endif]-->

    </head>

    <body>

    <div id="main">

    <h1>Apple-like Slideshow Gallery</h1>
    <div id="gallery">

    <div id="slides">

    <div class="slide"><img src="img/sample_slides/macbook.jpg" width="920" height="400" alt="side" /></div>
    <div class="slide"><img src="img/sample_slides/iphone.jpg" width="920" height="400" alt="side" /></div>
    <div class="slide"><img src="img/sample_slides/imac.jpg" width="920" height="400" alt="side" /></div>
    <div class="slide"><a href="http://tutorialzine.com/2009/10/beautiful-apple-gallery-slideshow/" target="_blank"><img src="img/sample_slides/info.jpg" width="920" height="400" alt="side" /></a></div>

    </div>

    <div id="menu">

    <ul>
    <li class="fbar">&nbsp;</li><li class="menuItem"><a href=""><img src="img/sample_slides/thumb_macbook.png" alt="thumbnail" /></a></li><li class="menuItem"><a href=""><img src="img/sample_slides/thumb_iphone.png" alt="thumbnail" /></a></li><li class="menuItem"><a href=""><img src="img/sample_slides/thumb_imac.png" alt="thumbnail" /></a></li><li class="menuItem"><a href=""><img src="img/sample_slides/thumb_about.png" alt="thumbnail" /></a></li>
    </ul>


    </div>

    </div>

    </div>

    </body>
    </html>

    原文地址:http://www.corange.cn/archives/2010/11/3727.html
  • 相关阅读:
    对话框风格的窗口
    对话框
    Notification的功能与用法
    滚动视图(ScrollView)的功能与用法
    css----overflow(布局)
    css----display(显示) 与 Visibility(可见性)
    css----position(定位)
    Vue.js----router(路由)
    HTTP协议-Cookie和Session详解
    MySql 复制表命令
  • 原文地址:https://www.cnblogs.com/zerogo/p/1879615.html
Copyright © 2011-2022 走看看