JQuery smooth rotation slide special effect code sharing, jquery special effect code
This article describes jQuery smooth rotation slide effects. Share it with you for your reference. The details are as follows:
This jQuery-based smooth rotating slide code, cool effect, pretty shocking scenes; picture size and color customization Please modify the jQuery-jcImgScroll.js.
Run: ------------------- view the download result source code -------------------
TIPS: If the browser cannot run properly, you can try to switch the browsing mode.
Key js Code:
<script src="js/jQuery-1.7.1.js" language="javascript" type="text/javascript"></script><script src="js/jQuery-easing.js" language="javascript" type="text/javascript"></script><script src="js/jQuery-jcImgScroll.js" language="javascript" type="text/javascript"></script><script language="javascript" type="text/javascript"><!-- $(function(){ $("#demo1").jcImgScroll({ }); $("#demo2").jcImgScroll({ count : 7 }); $("#demo3").jcImgScroll({ arrow : { width:110, height:342, x:220, y:0 }, count : 3, offsetX : 140, NumBtn : true, title:false });});--></script>
The jQuery smooth rotation slide code shared for you is as follows:
<Head> <title> jQuery smooth rotation slide Code </title> <style> <! --/* JQuery jcImgScroll css */. jcImgScroll {position: relative; height: 342px ;}. jcImgScroll li {border: 1px solid # ccc ;}. jcImgScroll li a {background: # fff; display: block; height: 340px ;}. jcImgScroll li. loading a {background: # fff url (img/loading.gif) no-repeat center ;}. jcImgScroll li img ,. jcImgScroll li ,. jcImgScroll em ,. jcImgScroll dl {display: none; border: 0 none ;}. jcImgScroll em. sPrev {Background: url (images/arrow-left.png) no-repeat left center ;}. jcImgScroll em. sNext {background: url (images/arrow-right.png) no-repeat right center ;}. jcImgScroll dl dd {background: url (images/NumBtn.png) no-repeat 0 bottom; text-indent:-9em ;}. jcImgScroll dl dd: hover ,. jcImgScroll dl dd. curr {background-position: 0 0;} --> </style> <script src = "js/jQuery-1.7.1.js" language = "javascript" type = "text/j Avascript "> </script> <script src =" js/jQuery-easing.js "language =" javascript "type =" text/javascript "> </script> <script src =" js/ jQuery-jcImgScroll.js "language =" javascript "type =" text/javascript "> </script> <script language =" javascript "type =" text/javascript "> <! -- $ (Function () {$ ("# demo1 "). jcImgScroll ({}); $ ("# demo2 "). jcImgScroll ({count: 7}); $ ("# demo3 "). jcImgScroll ({arrow: {width: 110, height: 342, x: 220, y: 0}, count: 3, offsetX: 140, NumBtn: true, title: false}); --> </script>
The above is the jQuery smooth rotation slide special effect code shared for everyone. I hope you will like it and apply it to practice.