Home  >  Article  >  Web Front-end  >  jquery plug-in orbit.js implements image folding and rotation effects_jquery

jquery plug-in orbit.js implements image folding and rotation effects_jquery

WBOY
WBOYOriginal
2016-05-16 16:04:121151browse

jQuery image folding rotation code, you can click the left and right arrow buttons to switch images, beautiful and concise. Compatible with mainstream browsers, phplearn is recommended for beginners to download!

How to use:
1. Head area reference files jquery.min.js, chuxz.css
2. Add 4fe5d0b678c5ba2dfd7510dee7b92bc9d2d0dc6c55787d0ab0740f9b3680fd36region code
in the file 3. Quote jq.orbit.js.js, orbit.js
at the bottom of the page 4. Copy the pictures in the images folder to the corresponding path

<div class="orbit-wrapper">       
  <div id="featured" class="orbit">  
    <a href="http://www.phplearn.cn/"><img src="images/1.jpg" width="185" alt="《Just Married》" title="《Just Married》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/2.jpg" width="185" alt="《佩加索斯》" title="《佩加索斯》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/3.jpg" width="185" alt="《太庙的一场偶遇》" title="《太庙的一场偶遇》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/4.jpg" width="185" alt="《为爱痴狂》" title="《为爱痴狂》"></a>  
    <a href="http://www.phplearn.cn/"><img src="images/5.jpg" width="185" alt="《游走,在北京的每一条街》" title="《游走,在北京的每一条街》"></a>  
  </div>  
</div>  
<script type="text/javascript" src="js/jq.orbit.js"></script>  
<script type="text/javascript" src="js/orbit.js"></script>

Demo picture:

The above is the entire content of this article, I hope you all like it.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn