User Tag List

Yeni Konu Aç Cevap Yaz
19.06.2013, 08:32 1 (permalink)
MustafaYildiz
  • Neredenİstanbul Şubesi
  • Üyelik Tarihi16.06.2013
  • Ticaret Sayısı0
  • Mesajlar625
Blogger için CSS3 Değişen Resim Efekti #permalink (permalink)
Blogger üzerinde gerçekleştirilmesi zor bir adım da resimler arasında geçiş sağlayan efektlerdir. Buna benzer geçiş efektlerini CSS3 tasarımları ile rahatlıkla uygulamanız mümkün. Bu gün sizler ile paylaşacağım kod dizini oldukça basit bir işlem ile çalışıyor. Link ekleyebileceğiniz bir resim üzerine mouse imleci ile gelindiğinde farklı bir görünüm sunuluyor. Neyden bahsedildiği daha net anlaşılsın diye bir adet demo ekledim. Demo örneğindeki resim üzerine geldiğinizde farklı bir görsel sunulduğunu fark edeceksiniz.


Blogger için CSS3 Değişen Resim Efekti Kodları


PHP- Kodu:
<style type="text/css">

a.nowandthen{
position:relative;
displayblock;
overflow:hidden;
cursorpointer;
width650px
height434px
}

a.nowandthen img{
position:absolute;
left:0;
top:0;
width100%;
height100%;
-
moz-transitionall 0.4s ease
-
webkit-transitionall 0.4s ease;
-
o-transitionall 0.4s ease;
-
ms-transitionall 0.4s ease;
transitionall 0.4s ease;
z-index2;
cliprect(0,650px,434px,0);
}


a.nowandthen img:nth-of-type(2){ 
z-index1;
}


a.nowandthen:hover img:nth-of-type(1){ 
cliprect(0,0,434px,0); 
opacity0;
}

</
style>

<
class="nowandthen" href="http://www.bloggerdersleri.com/">
 <
img alt="" src="http://2.bp.blogspot.com/-XgMF8m5_I4s/Ua9FXCAkg0I/AAAAAAAAHro/Y5WAydhFEXE/s1600/sunset-sunrise-btrix+(1).jpg" />
 <
img alt="" src="http://1.bp.blogspot.com/-VLHb1JqiTWY/Ua9FWGRxVNI/AAAAAAAAHrg/XF1gYctgGSA/s1600/sunset-sunrise-btrix+(2).jpg" />
</
a
Blogger için CSS3 Değişen Resim Efekti Modifiye

Kırmızı olarak verilmiş link resme tıklandığında ulaşılacak olan adres.
Mavi olanlar ise resim dosyaları. (1) olarak işaretlenmiş olan görülecek resmi tanımlar , ( 2 ) olarak işaretlenmiş ise mouse üzerine gelince görünecek resim.
Pembe alan ise paylaşılacak olan resim efektinin boyutunu belirler.


Read more: http://www.bloggerdersleri.com/2013/...#ixzz2WdZpNdAa
Hızlı PM Gönder
Gönder
Alıntı ile Cevapla
Yeni Konu Aç Cevap Yaz
Şu an bu konuyu okuyan kişi sayısı: 1 (0 üye ve 1 misafir)
 
Seçenekler
Yetkileriniz
Konu Acma Yetkiniz Yok Cevap Yazma Yetkiniz Yok Eklenti Yükleme Yetkiniz Yok Mesajınızı Değiştirme Yetkiniz Yok
BB code is Açık Smileler Açık [IMG] Kodları Açık HTML-Kodu Kapalı
Trackbacks are Açık
Pingbacks are Açık
Refbacks are Açık
Forum Kuralları
Benzer Konular
Konu Konuyu Başlatan Forum Cevap Son Mesaj
Siteye/Kişiye Özel Film, Dizi, Oyun Upload [Uygun Fiyatlar] promiL Upload İşleri 2 9.02.2012 17:46
Siteye/Kişiye Özel Film, Dizi, Oyun Upload [Uygun Fiyatlar] chaichen4 Internetten Para 0 11.12.2011 14:23
Dosya Adları , Uzantıları Ve Uzantıları açmak için Gerekli Programlar nelerdir ? SametE Programlar ve Araçlar 4 21.02.2010 12:58
.TR Alan Adları, Politikalar ve İşleyiş (mutlaka okuyun!) antiTRust Domain 4 13.05.2008 09:35
Google AdSense Kazancınızı Artırmak İçin İpuçları. Eseryucel Internetten Para 1 24.10.2004 03:10

Forum Saati: 11:20. Zaman dilimi GMT +3 olarak ayarlanmıştır.
Powered by vBulletin™ Version 3.8.7
Copyright © 2018 vBulletin Solutions, Inc. All rights reserved.
Kilo Nasıl Verilir btcfrm sihirlibardaklar.com instagram takipçi satın al