16 Nis 2021 06:21 Yeni Konu Oluştur

Haberler:

Sitemiz Smf 2.1 ve Smf 2.0 sürümleri için Destek ve Tema paylaşım forumudur


smf css3 slider

Başlatan snrj, 02 Ağu 2014 00:00

« önceki - sonraki »

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

*

  1. 3,077

  2. 584

  3. 960
02 Ağu 2014 00:00 Son düzenlenme: 02 Ağu 2014 00:01 Smfci

sadece css ile yapılmış güzel bir resim slider biraz editle daha kullanışlı hale getirilebilir (banner olarak kullanabilirsiniz değişen logo olarak kullanabilirsiniz vs...)
ben normal iki örnek verecem sadece anasayfa ve üstte heryerde gözükecek şekilde



sadece anasayfada gözüksün isteyenler
boardindex.template.php de bul ve üstüne ekle
<div id="boardindex_table">



bütün sayfalarda göstermek için
index.template.php bul ve altına ekle
echo '
</head>
<body>


kodlar
<style>
.container{
 
  width:100%;
  height:300px;
  overflow:hidden;
  border:1px solid;
  border-top-color:#856036;
  border-left-color:#5d4426;
  border-bottom-color:#856036;
  border-right-color:#5d4426;
  position:relative;

}
.photo{
  position:absolute;
  animation:round 32s infinite;
  opacity:0;
  width:100%;height:300px;
}
@keyframes round{   
  25%{opacity:1;}
  40%{opacity:0;}
}

img:nth-child(4){animation-delay:0s;}
img:nth-child(3){animation-delay:6s;}
img:nth-child(2){animation-delay:12s;}
img:nth-child(1){animation-delay:18s;}
</style>
<div class="container">
  <img class="photo"  src="http://farm9.staticflickr.com/8320/8035372009_7075c719d9.jpg" alt="" />
  <img class="photo"  src="http://farm9.staticflickr.com/8517/8562729616_35b1384aa1.jpg" alt="" />
  <img class="photo"  src="http://farm9.staticflickr.com/8465/8113424031_72048dd887.jpg" alt="" />
  <img class="photo"  src="http://farm9.staticflickr.com/8241/8562523343_9bb49b7b7b.jpg" alt="" />

</div>



resim yollarını kendinize göre düzeltin


MENU ×