AutoCAD 3DMAX C语言 Pro/E UG JAVA编程 PHP编程 Maya动画 Matlab应用 Android
Photoshop Word Excel flash VB编程 VC编程 Coreldraw SolidWorks A Designer Unity3D
 首页 > JavaScript

js+css实现上下翻页相册代码分享

51自学网 http://www.wanshiok.com
js,css,js上下翻页效果,相册

 这是一款基于js+css实现上下翻页相册特效代码,相册可以从上下两个方向进行切换,是一款非常实用的幻灯片特效源码。
 先为大家展示效果图:

效果演示 源码下载

为大家分享的jQuery幻灯片带缩略图轮播代码如下

 <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  <title>js+css实现上下翻页相册</title>  <link rel="stylesheet" type="text/css" media="screen" href="css/reset.css" /> <link rel="stylesheet" type="text/css" media="screen" href="css/960.css" /> <link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />  <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="js/demo.js"></script> </head>  <body> <div class="container_12" id="wrapper"> <div class="grid_8" id="content"><br /><br /><br /><br /><br /><br /><br />  <!-- relevant for the tutorial - start --> <div class="grid_6 prefix_1 suffix_1" id="gallery">  <div id="pictures">  <img src="images/picture1.png" alt="" />  <img src="images/picture2.png" alt="" />  <img src="images/picture3.png" alt="" />  <img src="images/picture4.png" alt="" />  <img src="images/picture5.png" alt="" />  </div>    <div class="grid_3 alpha" id="prev">  <a href="#previous">« Previous Picture</a>  </div>  <div class="grid_3 omega" id="next">  <a href="#next">Next Picture »</a>  </div> </div> <!-- relevant for the tutorial - end -->   </body></html>

以上就是为大家分享的js+css实现上下翻页相册代码,希望大家可以喜欢。


js,css,js上下翻页效果,相册  
上一篇:jquery SweetAlert插件实现响应式提示框  下一篇:javascript实现图片上传前台页面