Потребен е начин да се создаде ефект на лизгање на сликата во Elementor ? Во оваа статија, ќе ве водиме да креирате ефект на лизгање слики користејќи Elementor на вашите веб-страници.
Ефектот за лизгање на сликата ќе ви овозможи да ја откриете целосната слика кога корисникот лебди над сликите. Кога посетувате веб-локација што продава шаблони за веб-локации, можете да го видите целосниот преглед на шаблоните со карактеристики на ефектот на лизгање на слики.
Со овие карактеристики, можете лесно да им го покажете на вашите корисници целосниот приказ на веб-локацијата на мал простор. Нормално, ако сакате да прикажете целосна слика на веб-локација, таа ќе зазема многу простор на вашите веб-страници. Покрај тоа, тоа влијае на дизајнот на вашата веб-страница.
Но, со ефектот на лизгање на сликата, можете да додадете повеќе слики на атрактивен начин што лесно може да го привлече вниманието на публиката.
Креирајте ефект на лизгање на сликата во Elementor
Elementor не обезбедува виџет за додавање ефект на лизгање на сликата. Значи, треба да го додадете ефектот користејќи прилагодено CSS. Прилагодената CSS функција е достапна само со Elementor Про. Затоа проверете дали сте надградиле на Elementor Pro.
Сега, отворете страница со уредникот Elementor и кликнете на иконата плус за да додадете дел.
Сега треба да ја изберете колоната за вашиот дел. Овде го избираме делот со една колона.
Сега кликнете на иконата за уредување на делот и во табулаторот за распоред поставете ја минималната висина на 500.
Сега од додатокот за блок, додадете го блокот од внатрешниот дел во креираниот дел и отстранете ја стандардната колона. Кликнете со десното копче на иконата за уредување на колоната и кликнете на опцијата за бришење за да ја избришете главната колона.
Повторно одете во опцијата за уредување на внатрешниот дел и во табулаторот за распоред поставете ја минималната висина на 500 како што покажавме претходно.
Сега префрлете се на јазичето стил на внатрешниот дел и поставете ја позадината како класична од опцијата за заднина. Следно, треба да ја додадете вашата слика за позадина. Од опцијата позиција на слика, поставете ја позицијата на сликата со Врвен центар. Од опцијата за повторување, поставете ја опцијата не-повторување и големината како покривање на.
Сега префрлете се на јазичето напредни за да додадете сопствен CSS. Во полето Прилагодено CSS, додадете го следниов код:
селектор{ -webkit-transition: ease-in-out 3s !важно; транзиција: лесно-во-излез 3s !важно; } избирач: лебди{ позадина-позиција: централно дно !важно; }
Можете да ја промените вредноста на преодот за да го промените ефектот на лизгање на сликите. Ако сакате да додадете повеќе слики со ист ефект, можете да ја дуплирате колоната и потоа да ја промените сликата за заднина.
Заклучок
Следејќи го процесот, ќе можете да додадете ефект на лизгање на сликата на вашата веб-страница користејќи го создавачот на страници Elementor. Можете да ги проверите нашите други написи за да дознаете:
- Како да ги користите блоковите на Elementor во уредникот Гутенберг?
- Elementor vs Divi vs SeedProd – Што е подобро?
- Како да се користи историјата за поништување и повторување дејства во Elementor
- Како да направите веб-страница на Elementor супер брза
- Како да креирате интерактивен круг во Elementor
Се надеваме дека овој напис ќе ви биде корисен. Ако ви се допаѓа овој напис, ве молиме лајкнете ја нашата Фејсбук страница за да останете поврзани.
Написите се приклучуваат
- JetElements: Одличен додаток на Elementor со одлични графички контроли
- 22 најдобри премиум додатоци за Elementor
- Elementor vs Beaver Builder: Детална споредба на градители на страници
- Преглед на Elementor 2024: Искуство со Elementor (добрите, лошите страни, карактеристики и повеќе)
- Како да креирате интерактивен круг во Elementor
- Како да направите веб-страница на Elementor супер брзо: Целосно упатство
- Како да мигрирате страница во Elementor Cloud
- 5 најдобри додатоци за довод на Инстаграм за Elementor [Нашите најдобри избори]