​x
 
•<!DOCTYPE HTML>
<html>
<head>
    <!-- jQuery -->
    <script src="jquery.min.js"></script>
​
    <!-- Cycle js -->
    <script src="jquery.cycle.all.js"></script>
    
    <style>
    .pics {  
        height:  232px;  
        width:   232px;  
        padding: 0;  
        margin:  0;  
    } 
    .pics img {  
        padding: 15px;  
        border:  1px solid #ccc;  
        background-color: #eee;  
        width:  200px; 
        height: 200px; 
        top:  0; 
        left: 0 
    }
    </style>
</head>
<body style="direction:rtl">
​
<div class="pics" id="slider"> 
    <img src="images_cycle/beach1.jpg" width="200" height="200" /> 
    <img src="images_cycle/beach2.jpg" width="200" height="200" /> 
    <img src="images_cycle/beach3.jpg" width="200" height="200" /> 
</div>
​
<script>
$(document).ready(function(){
    $('#slider').cycle({ 
        fx:     'scrollDown', 
        random:  1
    });
});
</script>
​
</body>
</html>  
×

Report a Problem: