Css ile resim yansıma efekti ( Hover )
SanalData’yı Google’da tercih edilen kaynak olarak ekleyin
Harun Kılıçlar
· 1 dk okuma
· 7 okunma
Merhabalar,
Aşağıdaki css ile resim üzerine getirince resim üzerinde güneş yansıması gibi efek geçiyor shine efect diye geçiyor
Css kod
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
/*RESİM YANSIMA EFEKTİ*/ figure { width: auto; height: auto; margin: 0; padding: 0; background: #fff; overflow: hidden; } .shine figure { position: relative; } .shine figure::before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); } .shine figure:hover::before { -webkit-animation: shine .75s; animation: shine .75s; } @-webkit-keyframes shine { 100% { left: 125%; } } @keyframes shine { 100% { left: 125%; } } /*RESİM YANSIMA EFEKTİ*/ |
Resim tarafında kullanımı aşağıdaki gibidir
|
1 2 3 |
<div class="shine"> <figure><img src="https://picsum.photos/300/200?image=244" /></figure> </div> |
Günün zaman çizelgesi
Haber eklenme saatine göre sıralanır.
- Bugün
- Apple’ın metin bildirimli akıllı ev kamerası iddiası
- Apple, iPhone Duo için yeni Shot on iPhone kampanyasını başlattı
- Apple, Brüksel’de teknoloji lobisinin en aktif şirketlerinden
- Apple gündeminde iPhone Duo, AirPods 5 ve mesajla sipariş
- Armadin, yapay zekâ güvenliği için 255,5 milyon dolar topladı
- Lyft, sürücü sınıflandırması davasında 272,5 milyon dolar ödeyecek
- GrayKey, iPhone’un 72 saatlik güvenlik kilidini aşabilir
- Grok’un Maduro operasyonunu Trump’a önerdiği iddia edildi
- GTA 6’nın hava sistemi yerel yağış ve kasırgalar sunacak
- Apple Arcade kataloğuna beş yeni oyun eklendi
- Dün
- Audible, yapay zekâ destekli interaktif hikâyeleri duyurdu
- Kena: Scars of Kosmora’nın çıkışı 2027’ye ertelendi
- Google Gemini Live, küçük yazıları okuyabilecek
- Android Central ekibi işten çıkarıldı, yayınlar sürecek
Yazar
Harun Kılıçlar
Harun, yazılım geliştirme, web teknolojileri, mobil uygulamalar, veritabanı sistemleri ve yapay zekâ üzerine çalışan bir teknoloji editörüdür. SanalData’nın kurucusu olarak yazılım, yapay zekâ, mobil teknolojiler ve teknoloji sektöründeki gelişmeleri izler ve değerlendirir.