Blogger Resimli Slayt Gösterisi

resimli slayt gösterisi ile bir çok resmimizi dağınık bir şekil yerine albüm gibi gösteri yapabiliriz.Bu hem sitemize görsellik katar hemde sitemizdeki dağınıklığını gidermemize ve istersek resimle link ekleyerek sayfalarımıza veya kayıtlarıma istersekte dışarı aktarma yapabiliriz

KOD:

 <style>
#slideshow {margin:50px auto;position:relative;width:240px;height:240px;padding:10px;box-shadow: 0 0 20px rgba(0,0,0,0.4);}
#slideshow > div {position:absolute;top:5px;left:-1px;right:10px;bottom:10px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
$(function() {
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slideshow');
}, 3000);
});
</script>
<div id="slideshow">
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
</div>

Blogger Resimli Slayt Gösterisi Üzerinde Yapılacak Değişiklikler

• width:240px;height:240px :  Width ve Height olarak belirlenmiş alanlardaki boyutları kendi eklediğiniz resimlere göre değiştirebilirsiniz.
• <img alt="" class="icon-action" src="Image URL" /></div> :  İmage url olarak belirlenmiş alana kendi resimlerini eklemelisin.

Emeğe Saygı: http://googleyardimal.blogspot.com/