Beyaz.Net İpucu
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