javascript

Adobewordpress gururla sunar : “iPhone Mesajlar Ekranı”

Vatanay Özbeyli Yorum yazın CSS3, HTML5, jQuery, Öne Çıkanlar

iphone-mesajlar-css-html
Bugün sizlerle birlikte çok şık ve eğlenceli bir mesaj panosu tasarımı yapacağız.

iPhone‘un şık ve kullanışlı mesajlaşma ekranı hem sadeliği hem de kolay kullanılabilir olması sebebiyle izini sürebileceğimiz başarılı tasarımlardan birisi. Peki bu yapıyı web ortamına nasıl aktaracağız? HTML5 ve CSS3‘ün güçlendirilmiş yeni teknikleri ve jQuery‘nin fonksiyonelitesiyle bu iş sandığınız kadar zor olmayabilir.

Adobewordpress gururla sunar : Karşınızda responsive yapıdaki iPhone mesajlar ekranı tasarımı

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku


JavaScript ile 2 Resim Arasındaki Farkı Bul

Vatanay Özbeyli 1 Yorum jQuery

Dergi ve gazetelerin bilmece sayfalarında yer alan ve fazlasıyla dikkat isteyen “İki resim arasındaki 7 farkı bulun” türü bulmacaları hatırlar mısınız? Genellikle kısa bir göz gezdirmeyle 6 fark bulunur ancak her halükarda sonuncusu biraz uğraştırırdı.

Psikoloji bilimi bu bulmacaları, özellikle çocuklarda dikkat ve algıyı yönetme açısından faydalı göstermekte.

Bu makalemizde, seçtiğimiz iki resim arasındaki farkları JavaScript ile saniyeler içerisinde bulan bir kod öbeği paylaşacağız.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

WordPress’te JavaScript dosyalarını Footer’a taşımak

Vatanay Özbeyli 6 Yorum WordPress

Google PageSpeed Insights’da WordPress sitemi kontrol ettiğimde, JavaScript dosyalarımı sitenin altına taşımam gerektiğine dair bir uyarı alıyorum. Bu işlemi nasıl gerçekleştirebilirim?

Facebook sayfamızdan konuyla ilgili soru bu şekilde.

WordPress

JavaScript dosyalarının Footer’da siteye dahil edilmesi performans açısından büyük önem taşımakta. Dolayısıyla Google’ın PageSpeed kontrolü gibi birçok kalite kontrol robotu bu yapıyı denetlemekte. Ancak kullanıcılar bu sorunu aşmak için yanlış bir adresleme olan header.php’ye gidip ilgili JavaScript dosyalarını aramakta.

İşte anahtar ipucu burada. WordPress JS dosyalarını header.php’de değil, function.php’de sitenize ekliyor.

(daha&helliip;)

Devamını Oku

Kopyalanan yazıya otomatik olarak kaynak linki nasıl eklenir?

Vatanay Özbeyli 4 Yorum Diğer Konular & İpuçları

JavaScript

Dünyanın en popüler blogları bile ufak bir alıntıda kaynak linki vermeye ihtiyaç duyarken ülkemizde bu durum tam tersi. Özellikle blog yazarlarının şikayetçi olduğu bu makale hırsızlığı furyasına çözüm bulmak imkansız. Fakat JavaScript ile hırsızları en azından yavaşlatabilirsiniz.

Bu dersimizde sitenizden kopyalanan metinlere kaynak linki ekleyeceğiz. (daha&helliip;)

Devamını Oku

Web sayfanıza kısayol tuşları ekleyin!

Vatanay Özbeyli 2 Yorum Diğer Konular & İpuçları

ShortcutZiyaretçilerinizin sitenizde daha hızlı hareket edebilmeleri için kısayol tuşları atamaya ne dersiniz?

JavaScript desteği ile web sayfanız üzerinden herhangi bir köprü bağlantısına kısayol atayabilirsiniz. Sadece A, S, D, F gibi harfleri değil, CTRL ve ALT kombinasyonlarını da kullanabilirsiniz. Bu kısayol desteği müdavimlerinizin sayfanızı dolaşmasını kolaylaştıracaktır.

Detayları için makalemizin devamına göz atın.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

Sadece CSS ile Göster/Gizle Buttonu

Vatanay Özbeyli 3 Yorum CSS3, Tasarım Unsurları

CSS DersleriDivlerin veya herhangi bir elemanın görünürlüğünü açıp kapatmak için JavaScript ile birkaç satır kod karalamanız gerekmekte. Fakat bu makalemizde size küçük bir sır vereceğiz.

Bildiğiniz gibi form öğesi olan checkbox‘ın işaretlenip işaretlenmediğini CSS ile denetleyebiliyoruz. Kafanızda bir ampul yandı mı? Hadi konuyu biraz detaylandıralım.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

CSS Background Nedir? Nasıl Kullanılır?

Vatanay Özbeyli 2 Yorum CSS3, Tasarım Unsurları

CSS DersleriCSS‘in Background satırı arka plan görsellerimizin seçimini, yerleşimini, boyutunu ve pozisyonunu yönetmemizi sağlar.

Bu makalemizde web tasarımında kullanabileceğimiz tüm arka plan terimlerini tanıyacağız. Background’a etki edebilecek background-image, background-color, background-repeat, background-attachment ve background-position değerlerini de örneklendireceğiz. (daha&helliip;)

Devamını Oku

JavaScript ile Rastgele Veri

Vatanay Özbeyli 2 Yorum Diğer Konular & İpuçları, Tasarım Unsurları

JavaScriptMerhaba arkadaşlar. Bugün JavaScript ile rastgele veri üreten bir döngü hazırlayacağız. Bu işlem için rasgele veri yayınlayan bir fonksiyon ve gösterilmesini istediğimiz kayıtları hazırlayacağız. Bunu hazırlarken Dave Rupert’ın eğlenceli örneği üzerinden gideceğiz.

Bir proje üzerine yoğun bir şekilde çalışırken sizi arayarak dışarı çağıran arkadaşlarınız artık sorun değil. Mazeret üretici hizmetinizde !

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku