Jquery's simple banner carousel instance, jquerybanner
My friend showed me a carousel effect. I downloaded the js and saw a simple effect. I can write hundreds of lines in this way, which seriously affects the loading speed of the browser, think that broadband traffic is not worth money .. In desperation, I wrote a simple one for him. I put all the code in less than 70 lines, and the CSS with rounded corners. Not every browser has rounded corners, but it does not affect the appearance, hey.
Address: http://www.manongjc.com/article/90.html
<Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <title> untitled page </title> <script src =" js/jquery-2.1.4.js "type =" text/javascript "> </script> <style type = "text/css">. clear {overflow: hidden; clear: both; width: 0px; height: 0px ;}. imgbox {width: 640px; margin: 0 auto; text-align: center;} ul {padding: 0px; margin: 0px;} ul li {float: left; list-style: none;} ul li. select {display: block ;}. imgnum span {border-radius: 10px; font: normal bold 12px/15px micro Soft color; color: # FFF; margin-left: 5px; padding: 3px 6px 3px 6px; background-color: # F90; cursor: pointer ;}. imgnum span. onselect {background-color: # F00 ;}. imgnum {text-align: center; float: right; margin:-30px 30px; position: relative ;} </style>
Note that you need to reference the Jquery file. I will not put the image here. Replace it with myself. Pay attention to the length and width of the image.
As follows: