js+css實現上下翻頁相冊代碼分享
編輯：關於JavaScript
這是一款基於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實現上下翻頁相冊代碼，希望大家可以喜歡。
小編推薦
熱門推薦