Web Tasarımında On Scroll Animasyon Nasıl Kullanılır?

Animation On Scroll, web sayfalarını yüklemenin ve kaydırmanın temel etkisidir. Bir Öğe seçip ardından Özellik Paneline giderek ekleyebilirsiniz. On Scroll bağlantısına tıklayın ve Animasyon onay kutusunu işaretleyin. Bir Ön Ayar seçin ve gerekirse On Scroll Efektini özelleştirin. Kaydırma Efektinde Animasyonu görmek için önizleyin.

Windows için indirin Mac için indirin

Özellik kategorilerine göre göz atın

Web Sayfası Öğeleri

Desteklenen Sistemler

Görsel Sayfa Düzenleyici

Site ve Sayfa Özellikleri

WordPress Widget'ları

Döngü Animasyonu

Günümüzde birçok web sitesinde, ziyaretleri artırarak, markalaşmayı geliştirerek ve web sitelerinin benzersizliğini ekleyerek dikkat çekmek için kullanılan animasyonlu öğeler bulunmaktadır. Nicepage, web tasarımcılarını, profesyonelleri ve acemileri, kodlama olmadan animasyon açısından zengin bloklar oluşturma konusunda güçlendirir. Web sitenize animasyon ve etkileşim eklemek için Özellik Panelinde Döngü Animasyonu özelliğini etkinleştirerek JavaScript ve CSS'nin gücünü görsel Web Sitesi Düzenleyicisine getirebilirsiniz.

Animasyon Özelleştirme

Standart animasyon efektlerinin web sitesi fikriniz için çok az olduğunu ve istenen sonucu elde etmek için birkaç animasyon efektini karıştırmanız gerektiğini varsayalım. Özelleştirilebilir Animasyon Ön Ayarları için kullanılabilen özellikleri tam olarak kontrol edebilirsiniz. Ve yalnızca minimum ince ayar ile Kitaplıktan Önceden Tasarlanmış Animasyon Hazır Ayarlarını seçin. Özellik Paneline gidebilir ve Soldurma, Taşıma, Yakınlaştırma, Yuvarlama, Döndürme ve Spiral Efektlerin tüm özelliklerini özelleştirebilirsiniz.

Animasyon Ön Ayarları

Animation On Scroll ön ayarlarını kullanabilirsiniz. Ve bunların iki türü vardır: Özellikleri tamamen düzenleyebileceğiniz Özelleştirilebilir Animasyon Ön Ayarları, yalnızca Kitaplıktan seçebileceğiniz ve minimum ince ayara sahip Ön Tasarımlı Animasyon Ön Ayarları.

Fade Animasyon Efekti

Soldurma efekti, resim, metin veya arka plan gibi bir öğenin yavaş yavaş kaybolduğu ve web sayfasında yeniden göründüğü biçimsel bir geçiştir. Bir Öğe seçip Özellik Panelinde Kaydırıldığında Animasyonu seçerek Solma Efektini ayarlayabilirsiniz.

Slayt Animasyonu Efekti

Sayfa yükleme veya kaydırma sırasında öğenizin belirli bir yönde kademeli olarak bir noktadan diğerine hareket etmesini istiyorsanız Efekti ekleyin. Bir Öğe ekleyerek, bir Öğe seçerek ve ardından Özellik Panelinin Kaydırıldığında Animasyon bölümünde Slayt Ön Ayarını tıklatarak Slayt Efektini belirtin.

Yakınlaştırma Animasyonu Etkisi

Yakınlaştırma Etkisi, bir Öğenin boyutunu değiştirirken kademeli görünümün geçişidir. Web sayfası yükleme veya kaydırma sırasında bir Öğeyi kapatmaya izin verir.

Flip Animasyon Efekti

Bir Elemanın yarı dönüşünü uygulamak için Çevir efektini uygulayın, böylece mevcut Elemanın hem ön hem de arka taraflarını görebilirsiniz. Flip direği X Ekseni veya Y Ekseni ile seçebilirsiniz. Özellik Panelinde Kaydırıldığında Animasyon için bir Öğe ve ardından Çevirme Ön Ayarını seçebilirsiniz.

Sıçrama Animasyon Etkisi

Sayfa kaydırma sırasında Öğenin tekrar aşağı, yukarı ve hızlı bir şekilde aşağı hareket etmesini sağlamak için Sıçrama Animasyonu efektini kullanın. Özellik Panelinin Kaydırmada Animasyon bölümünde ilgili Ön Ayara tıklayarak Kaydırmada Sıçrama Animasyonunu etkinleştirebilirsiniz.

Döndür Animasyon Efekti

Döndürme Etkisi, bir öğeyi deformasyon olmadan sayfada sabit bir nokta etrafında döndüren bir dönüşümü tanımlar. Bu Efekt, Özellik Panelinin Kaydırıldığında Animasyon bölümünde bulabileceğiniz bir ön ayar olarak da mevcuttur.

Kutu Animasyon Etkisi

The Box veya Jack In The Box, Popüler bir şaka oyuncağı hareketini taklit eden bir geçiş efekti yaratır. Merkezi sönümleme ile başlar ve bir taraftan diğerine sallama ile devam eder.

Flaş Animasyon Efekti

Yanıp sönme ile de ilişkilendirilen Flash Animasyon da ziyaretçilerin ilgisini çekmek için popülerdir. Animasyonlu nesnenin veya metnin opak durumuna vurgu yapan bir dizi solma ve kararma geçişleri gibi görünür.

Menteşe Animasyon Etkisi

Menteşe Etkisi ile bir Eleman, akla gelebilecek bir menteşe noktasında ani bir hızlı hareketle durarak döner veya dönmesine neden olur. Bu doğal geçiş, web tasarımınızdaki etkileşime sürpriz katabilir.