Beyaz.Net İpucu

KATEGORİLER

Delphi
PHP
Dotnet
FileMaker

Jquery kayan slider

Kayan bir baner slider yapmak için :

JS

<script type="text/javascript" src="jquery.carouFredSel-6.2.1-packed.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".reklam").carouFredSel({
            auto: true,
            pagination: ".paging",
            auto: {
                pauseOnHover: 'resume',
                progress: 4000
            }
        });
                        
    });
</script>

CSS

.paging {
    float: left;
    margin-left: 10px;
    margin-top: -10px;
}
.paging a {
    background: none repeat scroll 0 0 #ccc;
    display: inline-block;
    height: 4px;
    margin-right: 5px;
    width: 10px;
}
.paging .selected {
    background: none repeat scroll 0 0 #ffffff;
    border: 0 none;
}
.paging a span {
    border: 0 none;
    display: none;
}

HTML

<div class="reklam">
    <a href='#' target='_blank'><img border='0' src='http://beyaz.net/tr/images/logo_beyazbilgisayar.gif' alt='beyaz.net' title='beyaz.net'/></a>
    <a href='#' target='_blank'><img border='0' src='http://beyaz.net/tr/images/logo_alt_b_guvenlik.gif' alt='beyaz.net' title='beyaz.net'/></a>
</div>
<div class="paging"></div>

Örnek : http://www.umraniye.bel.tr/ baner slider

JS Dosyası için tıklayınız.

Kategorideki Güncel Makaleler