本文实例讲述了jquery实现的3D旋转木马特效。分享给大家供大家参考。具体如下：
这是一款基于jquery实现的3D旋转木马特效代码，适合用于产品展示，便于用户循环浏览产品细节，是一款非常实用的特效代码。
运行效果图：----------------------查看效果 下载源码-----------------------
小提示：浏览器中如果不能正常运行，可以尝试切换浏览模式。
为大家分享的jquery实现的3D旋转木马特效代码如下
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link href="https://www.jb51.net/favicon.ico" type="image/x-icon" /> <title>jq 3D旋转木马</title> <link href="https://www.jb51.net/css/main.css" type="text/css" /> <script type="text/javascript" src="https://www.jb51.net/js/jquery-1.8.0.js"></script> <script type="text/JavaScript" src="https://www.jb51.net/js/cloud-carousel.1.0.5.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#da-vinci-carousel").CloudCarousel( { reflHeight: 56, reflGap:2, titleBox: $('#da-vinci-title'), altBox: $('#da-vinci-alt'), buttonLeft: $('#but1'), buttonRight: $('#but2'), yRadius:40, xPos: 285, yPos: 120, speed:0.15, mouseWheel:true }); $("#carousel2").CloudCarousel({ xPos:280, yPos:80, buttonLeft: $('#but3'), buttonRight: $('#but4'), FPS:30, autoRotate: 'left', autoRotateDelay: 1200, speed:0.2, mouseWheel:true, bringToFront:true }); }); </script> </head> <body> <center> <br><br><br> <div> <a href="https://www.jb51.net/images/382px-Leonardo_self.jpg" title="Leonardo Da Vinci"><img src="https://www.jb51.net/images/test9.png" alt="Self-portrait in red chalk, circa 1512-1515." title="Leonardo Da Vinci" /></a> <a href="https://www.jb51.net/images/396px-Mona_Lisa.jpg" title="Mona Lisa"><img src="https://www.jb51.net/images/test1.png" alt="Oil on cotton wood, circa 1503–1505." title="Mona Lisa" /></a> <a href='https://www.jb51.net/images/439px-The_Lady_with_an_Ermine.jpg' title="Lady with an Ermine"><img src="https://www.jb51.net/images/test2.png" alt="Oil on wood panel, 1485." title="Lady with an Ermine" /></a> <a href="https://www.jb51.net/images/Madonna_of_the_Yarnwinder.jpg" title="Madonna of the Yarnwinder"><img src="https://www.jb51.net/images/test3.png" alt="Oil on canvas, circa 1501." title="Madonna of the Yarnwinder" /></a> <a href="https://www.jb51.net/images/470px-Madonna_Litta.jpg" title="Madonna and the Child"><img src="https://www.jb51.net/images/test4.png" alt="Oil on canvas (transferred from panel), circa 1490." title="Madonna and the Child" /></a> <a href="https://www.jb51.net/images/390px-Bacchus_painting.jpg" title="Bacchus"><img src="https://www.jb51.net/images/test5.png" alt="Oil on walnut panel transferred to canvas, circa 1510–1515." title="Bacchus" /></a> <a href = "images/452px-Madonna_of_the_carnation_EUR.jpg" title="Madonna of the Carnation" ><img src="https://www.jb51.net/images/test6.png" alt="Oil on panel, circa 1478–1480." title="Madonna of the Carnation" /></a> <a href="https://www.jb51.net/images/454px-Leonardo_-_St._Anne_cartoon-alternative-downsampled.jpg" title="The Virgin and Child with St. Anne and St. John the Baptist"><img src="https://www.jb51.net/images/test7.png" alt=" Charcoal, black and white chalk on tinted paper, circa 1499–1500." title="The Virgin and Child with St. Anne and St. John the Baptist" /></a> <a href="https://www.jb51.net/images/FileLeonardo-da-Vinci-020.jpg" title="The Virgin and Child with St. Anne"><img src="https://www.jb51.net/images/test8.png" alt="Oil on panel, circa 1510." title="The Virgin and Child with St. Anne" /></a> <div ></div> <div ></div> <div></div> <div></div> </div> </center> <div> </div> </body> </html>
以上就是为大家分享的jquery实现的3D旋转木马特效代码，希望大家可以喜欢。
您可能感兴趣的文章: