<headr>
<link rel="stylesheet" href="nivo-slider.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="jquery.nivo.slider.pack.js" type="text/javascript"></script>
</headr>

<div id="slider">
<img src="images/file1.jpg" alt="" />
<a href="http://1barnamenevis.com"><img src="images/file2.jpg" alt="" title="#htmlcaption" /></a>
<img src="images/file3.jpg" alt="" title="سایت یک برنامه نویس با مقالات مفید و ارزشمند" />
<img src="images/file4.jpg" alt="" />
</div>
<div id="htmlcaption" class="nivo-html-caption">
سایت یک برنامه نویس با مقالات مفید و ارزشمند
</div>


#slider {
    position:relative;
    width:618px; /* Change this to your images width */
    height:246px; /* Change this to your images height */
    background:url(images/loading.gif) no-repeat 50% 50%;
}
#slider img {
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}
#slider a {
    border:0;
    display:block;
}

script type="text/javascript">
$(window).load(function() {
    $('#slider').nivoSlider();
});
</script>

<script type="text/javascript">
            $(window).load(function() {
                $('#slider').nivoSlider({
                    effect: 'random', // 'fold,fade,sliceDown'
                    slices: 15, // برای نمایش انیمیشنی تیکه ای
                    boxCols: 8, // برای تعداد ستون های نمایش جعبه ای
                    boxRows: 4, // برای تعداد سطر های نمایش جعبه ای
                    animSpeed: 500, // سرعت  اجرا انیمیشن
                    pauseTime: 3000, // زمان نمایش هر اسلاید
                    startSlide: 0, // شماره اسلاید شروع افزونه
                    directionNav: true, // نمایش هدایتگر بعدی و قبلی
                    directionNavHide: true, // نمایش  هدایتگر
                    controlNav: true, // 1و2و3و4و5 و... هدایتگر
                    controlNavThumbs: false, // استفاد از عکس کوچک اسلاید ها برای هدایتگر
                    controlNavThumbsFromRel: false, // استفاده از عکی متناظر
                    controlNavThumbsSearch: '.jpg', // Replace this with...
                    controlNavThumbsReplace: '_thumb.jpg', // پسوند فایل کوچ نمایش
                    keyboardNav: true, // استفاده از کیبرد برای هدایت
                    pauseOnHover: true, // قطع نمایش با رفتن موس برروی افزونه
                    manualAdvance: false, //
                    captionOpacity: 0.8, // درصد شفافیت
                    prevText: 'قبلی', //
                    nextText: 'بعدی', //
                    // Trigger  مرتبط
                    beforeChange: function() { }, //  تابع قبل از تغییر اسلاید
                    afterChange: function() { }, // تابع بعد از اجرای اسلاید
                    slideshowEnd: function() { }, // تابع اتمام اسلاید
                    lastSlide: function() { }, // تابع بعد از اخرین اسلاید
                    afterLoad: function() { } // تابع بعد اجرای افزونه
                });
            });
        </script>