Jquery Cycle plugin


Hi ,

Jquery gives us many plugin , One of this was cycle plugin 🙂

It was very nice .

U want fading effect ? or slidingRight effect ? or anyother ? We can see using this plugin

http://jquery.malsup.com/cycle/download.html

U will also provided with demo when u dowload 🙂

Then U need to include that jquery.min.all.js file and also include jquery.min.js. in your

html file


<html>
 <head>
 <script type = "text/javascript" src = "jquery-1.3.2.min.js"></script>
 <script type = "text/javascript" src = "jquery.cycle.all.min.js"></script>
 <script type = "text/javascript">
 $(document).ready(function(){
 $("#image_gallery").cycle({
 fx: 'fade' ,
 });
 });
 </script>
 <style type = "text/css">
 img{
 width:400px;
 height:300px;
 }
 #image_gallery{
 margin:5px auto;
 border-width:5px;
 border-color:black;
 border-style:solid;
 }
 </style>
 </head>
 <body>
 <div id = "image_gallery">
 <img src = "images/img1.jpg" >
 <img src = "images/img2.jpg">
 <img src = "images/img3.jpg">
 </div>
 </body>
</html>

Normal image tag only . only We should include javascript .

Script was –


<script type = "text/javascript">
 $(document).ready(function(){
 $("#image_gallery").cycle({
 fx: 'fade' ,
 });
 });
 </script>

thats all 🙂

U will see slideshow

My own demo : Demo of cycle Jquery .

 

Regards

sathia

Advertisements

About sathia

Web developer at cloudmint
This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s