Görüntü kaydırma efekti oluşturmanın bir yoluna mı ihtiyacınız var? Elementor ? Bu yazımızda, web sayfalarınızda Elementor kullanarak görsel kaydırma efekti oluşturmanız için size yol göstereceğiz.
Resim kaydırma efekti, kullanıcı fareyi resimlerin üzerine getirdiğinde tam resmi ortaya çıkarmanıza olanak tanır. Web sitesi şablonları satan bir web sitesini ziyaret ettiğinizde, görüntü kaydırma efekti özelliklerine sahip şablonların tam önizlemesini görebilirsiniz.
Bu özellikler sayesinde kullanıcılarınıza web sitesinin tam görüntüsünü küçük bir alanda kolayca gösterebilirsiniz. Normalde, bir web sitesinin tam bir görüntüsünü görüntülemek istiyorsanız, web sayfalarınızda çok yer kaplayacaktır. Ayrıca, web sitenizin tasarımını da etkiler.
Ancak resim kaydırma efektiyle, izleyicinin dikkatini kolayca çekebilecek çekici bir şekilde daha fazla resim ekleyebilirsiniz.
Elementor'da Görüntü Kaydırma Efekti Oluşturma
Elementor, görüntü kaydırma efekti eklemek için bir pencere öğesi sağlamaz. Bu nedenle, efekti özel CSS kullanarak eklemeniz gerekir. Özel CSS özelliği yalnızca Elementor Profesyonel Bu nedenle, yükselttiğinizden emin olun Elementor Pro.
Şimdi Elementor düzenleyiciyle bir sayfa açın ve bölüm eklemek için artı simgesine tıklayın.
Şimdi bölümünüz için sütunu seçmeniz gerekiyor. Burada tek sütun bölümünü seçiyoruz.
Şimdi bölüm düzenleme simgesine tıklayın ve düzen sekmesinde minimum yüksekliği 500 olarak ayarlayın.
Şimdi blok widget'ından iç bölüm bloğunu oluşturduğunuz bölüme ekleyin ve varsayılan sütunu kaldırın. Sütun düzenleme simgesine sağ tıklayın ve ana sütunu silmek için sil seçeneğine tıklayın.
İç bölümün düzenleme seçeneğine tekrar gidin ve düzen sekmesinde daha önce gösterdiğimiz gibi minimum yüksekliği 500 olarak ayarlayın.
Şimdi iç kısımdaki stil sekmesine geçin ve arka plan seçeneğinden arka planı klasik olarak ayarlayın. Ardından, arka plan resminizi eklemeniz gerekir. Görüntü konumu seçeneğinden, görüntünün konumunu şu şekilde ayarlayın: Üst merkez. Tekrarlama seçeneğinden, seçeneği ayarlayın tekrar yok ve boyutu gibi kapak.
Şimdi sekmeye geç gelişmiş Özel CSS eklemek için. Özel CSS alanına aşağıdaki kodu ekleyin:
seçici{ -webkit-geçişi: kolay giriş 3s !önemli; geçiş: kolay giriş 3s !önemli; } seçici:hover{ arka plan konumu: orta alt !önemli; }
Resimlerin kaydırma efektini değiştirmek için geçiş değerini değiştirebilirsiniz. Aynı efekte sahip birden fazla resim eklemek isterseniz, sütunu çoğaltabilir ve ardından arka plan resmini değiştirebilirsiniz.
Sonuç
Süreci takip ederek, sayfa oluşturucuyu kullanarak web sitenize bir resim kaydırma efekti ekleyebileceksiniz. Elementor. Öğrenmek için diğer yazılarımıza göz atabilirsiniz:
- Gutenberg editöründe Elementor blokları nasıl kullanılır?
- Elementor vs Divi vs SeedProd – Hangisi daha iyi?
- Elementor'da Eylemleri Geri Almak ve Yinelemek için Geçmişi Kullanma
- Elementor Web Sitesi Süper Hızlı Nasıl Yapılır?
- Elementor'da Etkileşimli Çember Nasıl Oluşturulur
Bu makalenin sizin için yararlı olacağını umuyoruz. Bu makaleyi beğendiyseniz, bağlantıda kalmak için lütfen Facebook sayfamızı beğenin.
