a {
-webkit-transition: all 0.7s linear;
-moz-transition: all 0.7s linear;
-o-transition: all 0.7s linear;
-ms-transition: all 0.7s linear;
transition: all 0.7s linear;
}
a:hover {
color: #000;
}
CSS Hover Kullanımı Nasıl Yapılıyor? |
21 Mesajlar | 13.901 Okunma | ||
- Üyelik 04.04.2012
- Yaş/Cinsiyet 36 / E
- Meslek Grafik tasarım
- Konum İstanbul Avrupa
- Ad Soyad ** **
- Mesajlar 1285
- Beğeniler 452 / 308
- Ticaret 0, (%0)
sunuda denersin buda jqeery gibi linklere özellik veriyor transparanlık gibi yavastan yavaştan linklerin üstü belirledigin rengi alıyor imzamdaki sitemde var bakabilirsin
www.mujdatsayar.com
- Üyelik 19.06.2012
- Yaş/Cinsiyet 34 / E
- Meslek Yazılım Geliştirici / Youtuber
- Konum Ankara
- Ad Soyad K** P**
- Mesajlar 1440
- Beğeniler 194 / 234
- Ticaret 46, (%100)
Hocam biraz reklam gibi olucak ama buyrun css e-kitap bira incelerseniz aradığınız herşeyi bulabilirsiniz
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
Abone Ol : www.youtube.com/@kerimpotuk
- Üyelik 04.04.2012
- Yaş/Cinsiyet 36 / E
- Meslek Grafik tasarım
- Konum İstanbul Avrupa
- Ad Soyad ** **
- Mesajlar 1285
- Beğeniler 452 / 308
- Ticaret 0, (%0)
prototürkte bir üye paylaşmıştı bende uyguladım güzel yani
Ek Olarak:
ne reklam gibisi olcak hocam sen insanları bilgilendiriyorsun ne güzel birşey bu
Ek Olarak:
Hocam biraz reklam gibi olucak ama buyrun css e-kitap bira incelerseniz aradığınız herşeyi bulabilirsiniz
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
ne reklam gibisi olcak hocam sen insanları bilgilendiriyorsun ne güzel birşey bu
www.mujdatsayar.com
- Üyelik 07.05.2012
- Yaş/Cinsiyet 29 / E
- Meslek Webmaster
- Konum Bursa
- Ad Soyad E** Ç**
- Mesajlar 1003
- Beğeniler 137 / 136
- Ticaret 17, (%100)
dadaslar025 adlı üyeden alıntı
a:hover {
text-decoration: none;
color: #CCCCCC;
}
Linklere hover özelliği vere bilirsin
Hocam oldu vallahi çok sağolun :) Peki bunun resimler için olanı nedir? Örneğin logoya eklemek istiyorum. Logoya gelince daha farklı bir resim çıksın istiyorum...
- Üyelik 04.04.2012
- Yaş/Cinsiyet 36 / E
- Meslek Grafik tasarım
- Konum İstanbul Avrupa
- Ad Soyad ** **
- Mesajlar 1285
- Beğeniler 452 / 308
- Ticaret 0, (%0)
logunun tagına nada background-url("http:resim/") eklemen gerekiyor sanırım yani hoverine ne bilim böylemi acaba bunuda yazın dostlar bende ögrenmek istiyorum vede buraya http://css3.bradshawenterprises.com/cfimg/ bakabilirsin müthiş efekler var
www.mujdatsayar.com
- Üyelik 21.03.2012
- Yaş/Cinsiyet 34 / E
- Meslek -
- Konum İstanbul Anadolu
- Ad Soyad F** A**
- Mesajlar 360
- Beğeniler 23 / 168
- Ticaret 0, (%0)
logo için şöyle
img:hover{
//özellikler
}
img:hover{
//özellikler
}
Buraya yakında yeni proje gelecek Coming soon!
- Üyelik 16.08.2011
- Yaş/Cinsiyet 28 / E
- Meslek Webmaster
- Konum İstanbul Avrupa
- Ad Soyad F** Ç**
- Mesajlar 175
- Beğeniler 48 / 41
- Ticaret 1, (%100)
Evet,
img:hover {background: url(../images/logohover.png)}
gibi ekleyebilirsin.:)
- Üyelik 06.07.2011
- Yaş/Cinsiyet 27 / E
- Meslek Öğrenci
- Konum İstanbul Anadolu
- Ad Soyad A** K**
- Mesajlar 2503
- Beğeniler 64 / 327
- Ticaret 23, (%100)
.footer p {
float:left;
text-shadow: 1px 1px grey;
font-size: 15px;
padding-top: 3px
}
.footer p: hover{
float:right;
text-shadow: 1px 1px grey;
font-size: 15px;
padding-top: 3px
}
Anladın mı? :)
- Üyelik 14.03.2012
- Yaş/Cinsiyet 34 / E
- Meslek Webmaster
- Konum Erzurum
- Ad Soyad S** K**
- Mesajlar 53
- Beğeniler 5 / 12
- Ticaret 0, (%0)
Hocam oldu vallahi çok sağolun :) Peki bunun resimler için olanı nedir? Örneğin logoya eklemek istiyorum. Logoya gelince daha farklı bir resim çıksın istiyorum...
.logo
{
width:200px; height:150px; background-image:url(resim1.jpg);
}
.logo:hover
{
width:200px; height:150px; background-image:url(resim2.jpg);
}
Logolara ben bu şekilde hover özelliği veriyorum
- Üyelik 07.05.2012
- Yaş/Cinsiyet 29 / E
- Meslek Webmaster
- Konum Bursa
- Ad Soyad E** Ç**
- Mesajlar 1003
- Beğeniler 137 / 136
- Ticaret 17, (%100)
mujdatsayar adlı üyeden alıntı
sunuda denersin buda jqeery gibi linklere özellik veriyor transparanlık gibi yavastan yavaştan linklerin üstü belirledigin rengi alıyor imzamdaki sitemde var bakabilirsin
a {
-webkit-transition: all 0.7s linear;
-moz-transition: all 0.7s linear;
-o-transition: all 0.7s linear;
-ms-transition: all 0.7s linear;
transition: all 0.7s linear;
}
a:hover {
color: #000;
}
Hocam vallahi işime yarayacak bu çok sağolun :)
Hocam biraz reklam gibi olucak ama buyrun css e-kitap bira incelerseniz aradığınız herşeyi bulabilirsiniz
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
http://www.kerimpotuk.com.tr/2012/06/29/css-egitimi-e-kitap/
Bunuda indirdim hocam arada göz atıyorum hatta sizin sitenizden indirmiştim çok sağolun :D
mujdatsayar adlı üyeden alıntı
logunun tagına nada background-url("http:resim/") eklemen gerekiyor sanırım yani hoverine ne bilim böylemi acaba bunuda yazın dostlar bende ögrenmek istiyorum vede buraya http://css3.bradshawenterprises.com/cfimg/ bakabilirsin müthiş efekler varSık kullanılanlara ekledim hocam çok beğendim harbi.
Furkan Çelebi adlı üyeden alıntı
Evet,img:hover {background: url(../images/logohover.png)}
gibi ekleyebilirsin.:)
Çok teşekkür ederim arkadaşlar şimdi deneme yapıyorum.
kralizasyon adlı üyeden alıntı
.footer p {
float:left;
text-shadow: 1px 1px grey;
font-size: 15px;
padding-top: 3px
}
.footer p: hover{
float:right;
text-shadow: 1px 1px grey;
font-size: 15px;
padding-top: 3px
}
Anladın mı? :)
Bu daha açık olmuş hocam çok sağolun :)
dadaslar025 adlı üyeden alıntı
.logo
{
width:200px; height:150px; background-image:url(resim1.jpg);
}
.logo:hover
{
width:200px; height:150px; background-image:url(resim2.jpg);
}
Logolara ben bu şekilde hover özelliği veriyorum
Size de çok teşekkür ederim hocam bilgi arşivime ekleyeceğim bunları.
Allah hepinizden razı olsun hover'ıda öğrenmiş oldum :)
Konuyu toplam 2 kişi okuyor. (0 kullanıcı ve 2 misafir)