æ¼äº®jQuery 3Då¨ç»å¾çè½®æåæ¢ç¹ææ件jquery.slicebox.jsï¼åºäºjQueryï¼æ件éç¨CSS 3D å¨ç»ææï¼æ¯æäºä»¶Callbackè°ç¨ï¼æ¯æåæ°èªå®ä¹é
ç½®ï¼å¦ï¼speedï¼600 åæ¢é度ãautoplay:true æ¯å¦èªå¨ææ¾ï¼å¨æµè§å¨å
¼å®¹æ¹é¢ï¼éè¦æµè§å¨æ¯æCSS3åæ¢åå½¢å±æ§ï¼ä¸æ¯æçå°çä¸å°3Dç¹æï¼æ¨èå¦ä¹ ä¸ä»£ç ã 使ç¨æ¹æ³ï¼ 1.å è½½æ件åjQuery 1 2 3 4 <link type="text/css" rel="stylesheet" href="css/slicebox.css" /> <script type="text/javascript" src="js/modernizr.js"></script> <script type="text/javascript" src="js/jquery8.js"></script> <script type="text/javascript" src="js/jquery.slicebox.js"></script> 2.HTMLå
容ï¼HTML头é¨éè¦éç¨HTML5头 <!DOCTYPE html> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <ul id="sb-slider" class="sb-slider"> <li> <img src="images/1.jpg" alt="image1"/> </li> <li> <img src="images/2.jpg" alt="image2"/> </li> <li> <img src="images/3.jpg" alt="image2"/> </li> <li> <img src="images/4.jpg" alt="image2"/> </li> <li> <img src="images/5.jpg" alt="image2"/> </li> </ul> <div> <span onclick="$slicebox.previous();">ä¸ä¸é¡µ</span> <span onclick="$slicebox.next();">ä¸ä¸é¡µ</span> <span onclick="$slicebox.jump(4);">跳页</span> </div> 3.å½æ°è°ç¨ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <script type="text/javascript"> var $slicebox; $(function() { $slicebox = $('#sb-slider').slicebox({ interval:6000, orientation : "r", //表示幻ç¯ççåæ¢æ¹åï¼å¯å (v)åç´æ¹å, (h)æ°´å¹³æ¹å or (r)éæºæ¹å perspective : 800, //éè§ç¹è·ç¦»ï¼å¯ä»¥éè¿æ¹åå
¶å¼æ¥çææ cuboidsCount : 5, //å¹»ç¯ç横åæ纵å被åå²çåæ°ï¼åå²çæ¯ä¸åå°ä¼ä»¥3Dçå½¢å¼åæ¢ cuboidsRandom : true, //æ¯å¦éæº cuboidsCount åæ°çå¼ maxCuboidsCount : 5, //设置ä¸ä¸ªå¼ç¨æ¥è§å®æ大ç cuboidsCount å¼ colorHiddenSides : "#333", //éèçå¹»ç¯ççé¢è² sequentialFactor : 150, //å¹»ç¯çåæ¢æ¶é´ï¼æ¯«ç§æ°ï¼ speed : 600, //æ¯ä¸å3Dç«æ¹ä½çé度 autoplay : true, //æ¯å¦èªå¨å¼å§åæ¢ onBeforeChange : function(position) { return false; }, onAfterChange : function(position) { return false; } }); }); </script> åæ°è¯´æ: orientation : "r", //表示幻ç¯ççåæ¢æ¹åï¼å¯å (v)åç´æ¹å, (h)æ°´å¹³æ¹å or (r)éæºæ¹å perspective : 800, //éè§ç¹è·ç¦»ï¼å¯ä»¥éè¿æ¹åå
¶å¼æ¥çææ cuboidsCount : 5, //å¹»ç¯ç横åæ纵å被åå²çåæ°ï¼åå²çæ¯ä¸åå°ä¼ä»¥3Dçå½¢å¼åæ¢ cuboidsRandom : true, //æ¯å¦éæº cuboidsCount åæ°çå¼ maxCuboidsCount : 5, //设置ä¸ä¸ªå¼ç¨æ¥è§å®æ大ç cuboidsCount å¼ colorHiddenSides : "#333", //éèçå¹»ç¯ççé¢è² sequentialFactor : 150, //å¹»ç¯çåæ¢æ¶é´ï¼æ¯«ç§æ°ï¼ speed : 600, //æ¯ä¸å3Dç«æ¹ä½çé度 autoplay : true, //æ¯å¦èªå¨å¼å§åæ¢
温馨提示:答案为网友推荐,仅供参考