Diapo一款支持手持设备的内容型幻灯片

Diapo一款支持手持设备的内容型幻灯片
 点击预览  点击下载

Diapo是一个简单且易于使用的内容滚动幻灯片插件,让你能够在网页中展示很酷的动画切换效果。此插件所能展示的内容不仅仅是图片,甚至可以是视频,其他任意你能想到的网页元素都能显示在其上。

插件的滚动控制方式也有自动播放、前后按钮、缩略图导航这3种方式。除此之外,此插件效果也支持在移动设备中浏览,可以通过参数设置是否开启这一选项。 

使用方法:

1、加载库文件,样式表等

  1. <link rel='stylesheet' id='style-css'  href='diapo.css' type='text/css'> 
  2. <script src="jquery.min.js" type="text/javascript"></script> 
  3. <script type='text/javascript' src='jquery.easing.1.3.js'></script> 
  4. <script type='text/javascript' src='jquery.hoverIntent.js'></script> 
  5. <script type='text/javascript' src='diapo.js'></script> 

2、展示内容

  1. <div class="pix_diapo">  
  2.     <div data-thumb="缩略图.jpg">  
  3.       <img src="原图.jpg">  
  4.       <div class="caption elemHover fromLeft">  
  5.         这里设置副标题  
  6.       </div>  
  7.     </div>  
  8.     ...省略  
  9. </div> 

3、初始化

  1. $('.pix_diapo').diapo(); 

转载请注明:代码家园 » Diapo一款支持手持设备的内容型幻灯片

评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)