lostyazilim
tr.link

Logonuza Harlem Shake!

12 Mesajlar 2.830 Okunma
acebozum
tr.link

Riza Riza 1337 @ trendyol Kullanıcı
  • Üyelik 28.10.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek 1337
  • Konum İzmir
  • Ad Soyad R** S**
  • Mesajlar 1843
  • Beğeniler 1008 / 403
  • Ticaret 21, (%100)
[SIZE=1][COLOR=#696969]-- Olduğu gibi bloğumdan copy/paste -- [/COLOR][/SIZE][SIZE=1][COLOR=#696969]
[/COLOR][/SIZE]

Daha önce Gagnam Style Çılgınlığı Adına yazımda belirttiğim gibi bu akımdan etkilenen logomuz bu sefer de Harlem Shake akımına ayak uyduruyor , nasıl mı ? Yukarıdan logomuzun üzerine mouse imlecinizi üzerine getirin ve izleyin Fazla uzatmadan yapımına geçelim , öncelikle titreşim animasyonu için css dosyamızın en altına , veya siz nereye uygun görüyorsanız , istediğimiz yere şu classları ekliyoruz ;



@-webkit-keyframes spaceboots {
0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}
.shake:hover,
.shake:focus {
-webkit-animation-name: spaceboots;
-webkit-animation-duration: 0.8s;
-webkit-transform-origin:50% 50%;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
.shake {
display:inline-block
Sonra titreşmesini ve üzerine gelindiğinde bangır bangır harlem shake çalmasını istediğiniz yeri belirliyoruz,örneğin benim logom şu şekilde ;

32ByteÖrneğin ;

32ByteSonra bir HTML5 nimeti olan audio nesnesini uygun olan yere ekliyoruz , logonuzun hemen alt satırına koyabilirsiniz , gözükmüyor çünkü ;

Ses dosyasını Wikipedia dan çekiyor , ne trafik sıkıntınız olur nede hız :D

Bunu da ekledikten sonra yukarıda shake classını atadığımız a tagının içerisine ;

32Byte”document.getElementById(‘beep-one’).play()” onmouseout=”document.getElementById(‘beep-one’).pause()”ekliyoruz , buraya kadar tüm adımları anlattığım gibi uyguladıysanız harlem shake yapan logonuz sizinle! :)

# Kaynak : http://32byte.org/harlem-shake-cilginligi-blogunuzda.html

[SIZE=1][COLOR=#ff0000]- bi yorum atsanız fena olmaz =p - [/COLOR][/SIZE]
Asklepion kilitbilgi Airport

kişi bu mesajı beğendi.

1337
elektronikssl
webimgo

Airport Airport Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 10.02.2013
  • Yaş/Cinsiyet 46 / E
  • Meslek Turizm ve Hotelcilik
  • Konum İstanbul Avrupa
  • Ad Soyad C** D**
  • Mesajlar 100
  • Beğeniler 43 / 18
  • Ticaret 0, (%0)
Hurlam Şuka :D Güzel teşekkürler
 

 

Riza Riza 1337 @ trendyol Kullanıcı
  • Üyelik 28.10.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek 1337
  • Konum İzmir
  • Ad Soyad R** S**
  • Mesajlar 1843
  • Beğeniler 1008 / 403
  • Ticaret 21, (%100)

Airport adlı üyeden alıntı

Hurlam Şuka :D Güzel teşekkürler


teşekkürler :D
 

 

1337

kilitbilgi kilitbilgi kilitbilgi@gmail.com Kullanıcı
  • Üyelik 13.06.2012
  • Yaş/Cinsiyet 31 / E
  • Meslek Bilgisayar Mühendisi
  • Konum İzmir
  • Ad Soyad B** Ç**
  • Mesajlar 396
  • Beğeniler 82 / 125
  • Ticaret 3, (%100)
Önceki çalışmanız gibi bu da çok eğlenceli,tebrikler :)
Riza

kişi bu mesajı beğendi.

wmaraci
wmaraci

AliBurak AliBurak Öğrenci Kullanıcı
  • Üyelik 15.11.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek Öğrenci
  • Konum İstanbul Avrupa
  • Ad Soyad A** U**
  • Mesajlar 744
  • Beğeniler 45 / 184
  • Ticaret 2, (%50)
Logo oynuyor şakır şakır ama şarkı yok hemen alt satırına ekledim :D
 

 

future future Computer Engineer Kullanıcı
  • Üyelik 27.06.2011
  • Yaş/Cinsiyet 36 / E
  • Meslek Computer Engineer
  • Konum Adana
  • Ad Soyad Y** Y**
  • Mesajlar 1165
  • Beğeniler 92 / 153
  • Ticaret 62, (%100)
Örnek var mı acaba hareketli ?
Teşekkürler.
 

 

Riza Riza 1337 @ trendyol Kullanıcı
  • Üyelik 28.10.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek 1337
  • Konum İzmir
  • Ad Soyad R** S**
  • Mesajlar 1843
  • Beğeniler 1008 / 403
  • Ticaret 21, (%100)

future adlı üyeden alıntı

Örnek var mı acaba hareketli ?
Teşekkürler.


www.32byte.org buyrun :)

Ek Olarak:

Ali Burak adlı üyeden alıntı

Logo oynuyor şakır şakır ama şarkı yok hemen alt satırına ekledim :D


adres verebilirseniz bakabilirim :)
 

 

1337

AliBurak AliBurak Öğrenci Kullanıcı
  • Üyelik 15.11.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek Öğrenci
  • Konum İstanbul Avrupa
  • Ad Soyad A** U**
  • Mesajlar 744
  • Beğeniler 45 / 184
  • Ticaret 2, (%50)
www.vaktinikullan.com
sessizde bi garip oluyormuş :D
 

 

reklamsiz reklamsiz Sms Onayı Gerekli Banlı Kullanıcı
  • Üyelik 04.02.2012
  • Yaş/Cinsiyet 31 / E
  • Meslek Web Programlama (öğrenci)
  • Konum Bursa
  • Ad Soyad ** **
  • Mesajlar 232
  • Beğeniler 31 / 43
  • Ticaret 2, (%100)
başka bir sitede görmüştüm mesela logonun üstüne geliyorsunuz belli bir yerden sonra sitedeki çoğu görsel oynamaya başlıyordu o tarz olabilirse çok daha mükemmel olur :)
 

 

Riza Riza 1337 @ trendyol Kullanıcı
  • Üyelik 28.10.2011
  • Yaş/Cinsiyet 28 / E
  • Meslek 1337
  • Konum İzmir
  • Ad Soyad R** S**
  • Mesajlar 1843
  • Beğeniler 1008 / 403
  • Ticaret 21, (%100)

reklamsiz adlı üyeden alıntı

başka bir sitede görmüştüm mesela logonun üstüne geliyorsunuz belli bir yerden sonra sitedeki çoğu görsel oynamaya başlıyordu o tarz olabilirse çok daha mükemmel olur :)


o tarz yapılmış site çok , bu diğerlerinden farklı olduğu için paylaştım ancak sizin istediğiniz gibi bir uygulama da burada mevcut :)
reklamsiz

kişi bu mesajı beğendi.

1337
wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al