blur

jQuery ile Scroll ve Arkaplan İlişkisi

Vatanay Özbeyli 2 Yorum CSS3, jQuery, Öne Çıkanlar

jQuery‘nin scrollTop tanımı ile birlikte web sayfalarındaki kaydırma çubuğununun seviyesini numerik olarak yakalayabiliyoruz. Hal böyleyken bu yapıyı niye CSS3 ile ilişkilendirip şık tasarımlar hazırlamayalım ki?

Bu dersimizde aşağıya scroll edildikçe büyüyen ve bulanıklaşan arkaplan tasarımı yapacağız. İşlevsellik yükünü jQuery, tasarım yükünü de CSS sırtlayacak. Hazırsanız başlayalım.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

Ücretsiz 15 Adet Blurred (Bulanık) Arkaplan

Vatanay Özbeyli 2 Yorum Kaynaklar

photoshop-blur-bgBu yazımızda sizler için hazırladığımız 15 adet bulanık arkaplan resimlerini paylaşacağız. 1920×1080 boyutlarındaki görsellerle ister masaüstünüz isterseniz de web sayfanızın arkaplanını süsleyin. “Bana balık vermeyin, balık tutmayı öğretin!” diyenleriniz de olacaktır.

Eğer bu görselleri nasıl hazırladığımızı öğrenmek istiyorsanız sizi buraya alalım : “Photoshop ile Bulanık Arkaplan Hazırlama” (daha&helliip;)

Devamını Oku

Photoshop Blur Efektleri : Bölgesel Odaklanma

Vatanay Özbeyli 1 Yorum Fotoğraf Efektleri, İpuçları

Photoshop ile Bölgesel Blur ~ OdaklanmaPhotoshop derslerimiz bölgesel blur efektiyle devam ediyor.

Bu efekt sayesinde görselinizin herhangi bir bölgesine bulanıklık katabilirsiniz. Temel hedef ise odaklanmayı sağlamaktır.

Özellikle geniş görüş açısına sahip fotoğraflara ayrı bir hava katan bu efekt beraberinde çalışmalarınıza derinlik vermenize de yardımcı olur.

Bu makalemizde sizler için Photoshop’un Tilt-Shift efektini inceledik. Ayrıca efektin arayüzünü tanımlayarak odaklanma temalı örnek bir fotoğraf hazırladık. (daha&helliip;)

Devamını Oku

HTML5 ve CSS3 ile Yaprak Menü

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

CSS’in transition  efektleriyle ilgili bir çok çalışma yaptık. Fiziksel efektlerinden de rotate ve bluru daha önce birkaç kez kullandık. Hadi gelin hem o bilgileri pekiştirelim hem de gayet şık bir menü tasarımı yapalım. Ama öncesinde aşağıdaki örnek .GIF dosyasını görüntülemenizde fayda var.

Yaprak Menü

Ya da canlı test etmek isteyebilirsiniz :

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku