HTML'de Kodlarla Yansıma Efekti

Bu dersimizde kendimin sık kullandığı bir efekt uygulamasını anlatmaya çalıştım. Pratik bir çalışma olduğu için işinize yarayacaktır.

Bu dersimizde kendimin sık kullandığı bir efekt uygulamasını anlatmaya çalıştım. Pratik bir çalışma olduğu için işinize yarayacaktır.

Genelikle kendi adıma konuşayım resmin yansıma halinide JPG olarak kaydedip o hali ile kullanırdım. Ama bunun çok pratik yolu da var: Reflection koduyla bir iki dokunuşla direk yansıma elde edebiliyorsunuz. Benim artık demirbaş kodlarımdan birisi haline geldi. Sizin de işinize yarayacağına eminim.

Öncelikle aşağıdaki linke sağ tıklayarak Farklı Kaydet yolu ile "yansima.js" dosyasını indiriyoruz ve çalıştığımız klasör içine kaydediyoruz.

İNDİRMEK İÇİN TIKLAYIN.

Daha sonra HTML kodlarını düzenlemek için programımızı açıyoruz ve

tagları arasına aşağıdaki kodu yazıyoruz:


<script type="text/javascript" src="yansima.js"></script>



Bu kodu yapıştırıp yansıma yapmak istediğimiz resmin kodunu bulup src'den sonraki kısma:


class="reflect rheight50 ropacity15"



kodumuzu yapıştırıyoruz.



Her yansıma yapmak istediğimiz resim için kullanıyoruz.

Bu benim ilk paylaşımım umarım faydalı olmuştur..

Kaynak ve daha geniş bilgi için buraya tıklayınız.
  • Etiketler;
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

@Bu benim ilk paylaşımım umarım faydalı olmuştur.. ama döküman senin deil kaynak ajax-tr tabiki birilerinde faydalı olmuşdur.
aylar öncesi HTML arşivime aldığım bir kod.. kaynak ise şu : http://www.dillonwelding.com/reflection/readme.html
Teşekkürler arkadaşım.bu güzellikte çalışmalarının devamını bekleriz.
Arkadaşlar kaynak diye bir olay yok. Kaynak= AJAX Kim ise bu Js sınıfını yazan ona ait. Yoksa HTML'e JavaScript Kodu entegre etmeyi herkes biliyor. Ve internettede her yerde var. Yani ortada bir çalışma yok malesef..
Güzel bir Çalışma Teşekkürler
teşekkürler güzel bilgi
resmin Class'ına tanımladığımız "rheight50" yi "rheight100" yaparsak resmin yansıması daha belirgin hal alıyor...
bunu programın içine nasıl yüklüyeceğiz.masaüstnden başka bir yere kopyalıyınca çalışmıyor.
:D teşekkürler arkadaşım...:-dusun:
gzl paylaşım
yüklemek istediğim resmin kodunu bilmiyosam n'apıcam????:agla:

Yukarı Git