超酷jquery書架圖片展示特效

编程随想

会python真的可以为所欲为 by Python自学0(回) 250天前

这里还有人吗 by mikeKil1(回) 435天前

这里还有人吗 by mikeKil0(回) 435天前

每天面对着电脑屏幕，敲打键盘。我所面对的并不只是代码，而是一种生活方式。 by js特效0(回) 660天前

到处都是羊，不想上班 by Python自学0(回) 740天前

鸽子 by 张书娥0(回) 744天前

[html]代码库

<!DOCTYPE HTML> <head> <title>jquery手架式图片展示效果Bookshelf Slider - jQuery Plugin</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" type="text/css" href="css/bookshelf_slider.css" /> <link rel="stylesheet" type="text/css" href="css/skin01.css" /> <link rel="stylesheet" type="text/css" href="css/demo.css" /> <style type="text/css"> body { background:#54493e url(assets/bg_texture_11.png) repeat; margin-top:100px; } /* #54493e */ </style> <script type="text/javascript" src="js/jquery-1.7.min.js"></script> <script type="text/javascript" src="js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="js/jquery.bookshelfslider.min.js"></script> </head> <body> <script type="text/javascript"> jQuery(document).ready(function() { // default parameters //$.bookshelfSlider('#bookshelf_slider'); //$.bookshelfSlider.config.item_width = 200; //$.bookshelfSlider('#bookshelf_slider'); //define custom parameters $.bookshelfSlider('#bookshelf_slider', { 'item_width': 845, //385 'item_height': 320, //320 'products_box_margin_left': 30, 'product_title_textcolor': '#ffffff', 'product_title_bgcolor': '#c33b4e', 'product_margin': 30, 'product_show_title': true, 'show_title_in_popup': true, 'show_selected_title': true, 'show_icons': true, 'buttons_margin': 15, 'slide_duration': 1000, 'slide_easing': 'easeOutQuart', 'arrow_duration': 800, 'arrow_easing': 'easeOutQuart', 'video_width_height': [500,290], 'iframe_width_height': [500,330] } ); });//ready </script> <div id="bookshelf_slider"> <div class="panel_title"> <div id="selected_title_box"><div id="selected_title">Selected Title</div></div> <div id="menu_top"> <ul> <li id="show_hide_titles" class="menutop_btn"><a href="#">Titles</a></li> <li id="show_hide_icons" class="menutop_btn"><a href="#">Icons</a></li> </ul> </div> </div> <div class="panel_slider"> <div id="panel_items" class="panel_items"> <div class="slide_animate"> <div class="products_box" id="products_box_1"> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/01_large.jpg" title="The Title is Optional 1"><img src="images/01.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://www.youtube.com/watch?v=C05pGnZQQtE" title="Youtube Video"><img src="images/02.jpg" alt="" width="71" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/25348908" title="Book Title"><img src="images/04.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Architecture & Design"><img src="images/06.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="content/iframe_content.html?size=450x330&id_prod=123" title="Iframe HTML Content"><img src="images/05.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/book_large.png" title="Book Seo"><img src="images/07.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="content/iframe_content.html?size=750x250&id_prod=123" title="Iframe HTML Content"><img src="images/05.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/book_large.png" title="Social Media"><img src="images/08.jpg" alt="" width="80" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Architecture & Design"><img src="images/06.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://www.youtube.com/watch?v=C05pGnZQQtE" title="Youtube Video"><img src="images/02.jpg" alt="" width="71" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/01_large.jpg" title="The Title is Optional"><img src="images/01.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/01_large.jpg" title="The Title is Optional 1"><img src="images/01.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://www.youtube.com/watch?v=C05pGnZQQtE" title="Youtube Video"><img src="images/02.jpg" alt="" width="71" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/25348908" title="Book Title"><img src="images/04.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Architecture & Design"><img src="images/06.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="content/iframe_content.html?size=450x330&id_prod=123" title="Iframe Content"><img src="images/05.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/01_large.jpg" title="The Title is Optional"><img src="images/01.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="content/iframe_content.html?size=450x330&id_prod=123" title="Iframe Content"><img src="images/05.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="false" data-url="http://www.youtube.com/watch?v=C05pGnZQQtE" title="Youtube Video"><img src="images/02.jpg" alt="" width="71" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Architecture & Design"><img src="images/06.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/book_large.png" title="Book Seo"><img src="images/07.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/6382511" title="Vimeo Video"><img src="images/03.png" alt="" width="81" height="107" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_2"> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_health.png" alt="" width="76" height="108" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_gourmet.png" alt="" width="71" height="100" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_001.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_house.png" alt="" width="91" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_web.png" alt="" width="71" height="93" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_fitness.png" alt="" width="76" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_health.png" alt="" width="76" height="108" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_gourmet.png" alt="" width="71" height="100" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_001.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_house.png" alt="" width="91" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="info"><img src="images/magazine_web.png" alt="" width="71" height="93" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_3"> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD1"><img src="images/cd_01.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD2"><img src="images/cd_02.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD3"><img src="images/cd_03.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD1"><img src="images/cd_01.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD2"><img src="images/cd_02.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD3"><img src="images/cd_03.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD1"><img src="images/cd_01.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD2"><img src="images/cd_02.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD3"><img src="images/cd_03.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD1"><img src="images/cd_01.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD2"><img src="images/cd_02.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD3"><img src="images/cd_03.png" alt="" width="80" height="80" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_4"> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_5"> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$459"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$347"><img src="images/phone_03.png" alt="" width="43" height="84" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$789"><img src="images/phone_02.png" alt="" width="45" height="88" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$459"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$347"><img src="images/phone_03.png" alt="" width="43" height="84" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$789"><img src="images/phone_02.png" alt="" width="45" height="88" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$459"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$347"><img src="images/phone_03.png" alt="" width="43" height="84" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$789"><img src="images/phone_02.png" alt="" width="45" height="88" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$459"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$347"><img src="images/phone_03.png" alt="" width="43" height="84" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$789"><img src="images/phone_02.png" alt="" width="45" height="88" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_6"> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_02_large.png" title="Tablet 2"><img src="images/tablet_02.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_02_large.png" title="Tablet 2"><img src="images/tablet_02.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_02_large.png" title="Tablet 2"><img src="images/tablet_02.png" alt="" width="88" height="115" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_7"> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$459"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="$789"><img src="images/phone_03.png" alt="" width="43" height="84" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="content/iframe_content.html?size=450x330&id_prod=123" title="$343"><img src="images/phone_02.png" alt="" width="45" height="88" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="http://vimeo.com/25348908" title="Book"><img src="images/04.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Book"><img src="images/06.jpg" alt="" width="100" height="107" /></a> <a href="#" class="product" data-type="magazine" data-popup="true" data-url="images/magazine_large.jpg" title="Magazine"><img src="images/magazine_health.png" alt="" width="76" height="108" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD1 Info"><img src="images/dvd_01.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD2 Info"><img src="images/dvd_02.jpg" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="dvd" data-popup="true" data-url="images/dvd_large.jpg" title="DVD3 Info"><img src="images/dvd_03.png" alt="" width="77" height="107" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD1"><img src="images/cd_01.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD2"><img src="images/cd_02.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_01_large.png" title="Tablet 1"><img src="images/tablet_01.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/tablet_02_large.png" title="Tablet 2"><img src="images/tablet_02.png" alt="" width="88" height="115" /></a> <a href="#" class="product" data-type="cd" data-popup="true" data-url="images/cd_large.jpg" title="Info CD3"><img src="images/cd_03.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="true" data-url="images/phone_large.jpg" title="Phone"><img src="images/phone_01.png" alt="" width="47" height="89" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/01_large.jpg" title="The Title is Optional"><img src="images/01.png" alt="" width="81" height="107" /></a> <a href="#" class="product" data-type="book" data-popup="true" data-url="images/06_large.jpg" title="Book Title"><img src="images/06.jpg" alt="" width="100" height="107" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_8"> <a href="#" class="product" data-type="" data-popup="true" data-url="content/105photoeffects.html?size=650x425" title="105 Photo Effects - BUNDLE"><img src="images/105-photo-effects-bundle-thumb.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-book-mockup-01/1047833" title="$5"><img src="images/3d_book_mockup_01_thumb.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/50-photo-effects-curl-shadows/252183" title="$5"><img src="images/50-photo-effects-thumb.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/30-photo-effects/289703" title="$6"><img src="images/30-photo-effects-thumb.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-book-cover-007/118463" title="$5"><img src="images/book-007.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-book-cover-004/153488" title="$5"><img src="images/book004.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-box-006/117650" title="$4"><img src="images/3dbox.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/magazine-001/119576" title="$5"><img src="images/mag001.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/stamp-generator/122735" title="$5"><img src="images/stamp.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/chrome-light-shadow-reflection/130645" title="$6"><img src="images/textchrome.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-book-cover-003/124992" title="$6"><img src="images/3dbook003.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/bottle-white-wine/120372" title="$5"><img src="images/wine.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/magazine-003/140086" title="$5"><img src="images/magazine003.png" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/magazine-002/128997" title="$5"><img src="images/magazine002.jpg" alt="" width="80" height="80" /></a> <a href="#" class="product" data-type="" data-popup="false" data-url="http://graphicriver.net/item/3d-book-cover-006/165663" title="$5"><img src="images/3d-book-006.jpg" alt="" width="80" height="80" /></a> </div> </div> <div class="slide_animate"> <div class="products_box" id="products_box_9"> <a href="#" class="product" style="margin-left:300px;" data-type="" data-popup="false" data-url="http://codecanyon.net/item/multipurpose-bookshelf-slider-jquery-plugin/1985655?ref=srvalle" title=""><img src="images/buy_bs_plugin.jpg" alt="" width="174" height="95" /></a> </div> </div> </div> </div>  <div class="panel_bar"> <div id="arrow_box"><div id="arrow_menu"></div> </div> <div class="button_items"> <div id="btn1" class="button_bar"><a href="#">Books</a></div> <div id="btn2" class="button_bar"><a href="#">Magazines</a></div> <div id="btn3" class="button_bar"><a href="#">CDs</a></div> <div id="btn4" class="button_bar"><a href="#">DVDs</a></div> <div id="btn5" class="button_bar"><a href="#">Phones</a></div> <div id="btn6" class="button_bar"><a href="#">Tablets</a></div> <div id="btn7" class="button_bar"><a href="#">Mix Products</a></div> <div id="btn8" class="button_bar"><a href="#">Graphic River</a></div> <div id="btn9" class="button_bar"><a href="#">Buy Plugin</a></div> </div> </div>  </div>  <div id="bookshelf_options"> <p align="center">来源：网络　代码整理：<a href="http://www.kaiwo123.com/" target="_blank">看我的特效网</a></p> <p align="center">* 尊重他人劳动成果，转载请自觉注明出处！注：此代码仅供学习交流，请勿用于商业用途。</p> <p align="center"><script type="text/javascript">/*760*90，创建于2011-12-8kaiwo*/ var cpro_id = 'u704891';</script><script src="http://cpro.baidu.com/cpro/ui/c.js" type="text/javascript"></script></p> </div> </body> </html>

[源代码打包下载]

用户注册

用户登录

发表随想

该用户最新代码

编程随想

[html]代码库

[源代码打包下载]

网友评论 (发表评论)

回复评论

回复评论

发表评论：

评论须知：

扫码下载

输入口令后可复制整站源码