логото на bloggerselite

Како да креирате ефект на лизгање на сликата во Elementor

ефект на лизгање на сликата во елементор

Потребен е начин да се создаде ефект на лизгање на сликата во Elementor ? Во оваа статија, ќе ве водиме да креирате ефект на лизгање слики користејќи Elementor на вашите веб-страници.

Ефектот за лизгање на сликата ќе ви овозможи да ја откриете целосната слика кога корисникот лебди над сликите. Кога посетувате веб-локација што продава шаблони за веб-локации, можете да го видите целосниот преглед на шаблоните со карактеристики на ефектот на лизгање на слики.

Со овие карактеристики, можете лесно да им го покажете на вашите корисници целосниот приказ на веб-локацијата на мал простор. Нормално, ако сакате да прикажете целосна слика на веб-локација, таа ќе зазема многу простор на вашите веб-страници. Покрај тоа, тоа влијае на дизајнот на вашата веб-страница.

Но, со ефектот на лизгање на сликата, можете да додадете повеќе слики на атрактивен начин што лесно може да го привлече вниманието на публиката.

Креирајте ефект на лизгање на сликата во Elementor

Elementor не обезбедува виџет за додавање ефект на лизгање на сликата. Значи, треба да го додадете ефектот користејќи прилагодено CSS. Прилагодената CSS функција е достапна само со Elementor Про. Затоа проверете дали сте надградиле на Elementor Pro.

Сега, отворете страница со уредникот Elementor и кликнете на иконата плус за да додадете дел.

ефект на лизгање на сликата во Elementor

Сега треба да ја изберете колоната за вашиот дел. Овде го избираме делот со една колона.

креирајте ефект на лизгање на сликата во Elementor

Сега кликнете на иконата за уредување на делот и во табулаторот за распоред поставете ја минималната висина на 500.

ефект на лизгање на сликата

Сега од додатокот за блок, додадете го блокот од внатрешниот дел во креираниот дел и отстранете ја стандардната колона. Кликнете со десното копче на иконата за уредување на колоната и кликнете на опцијата за бришење за да ја избришете главната колона.

креирајте ефект на лизгање на сликата во Elementor

Повторно одете во опцијата за уредување на внатрешниот дел и во табулаторот за распоред поставете ја минималната висина на 500 како што покажавме претходно.

Сега префрлете се на јазичето стил на внатрешниот дел и поставете ја позадината како класична од опцијата за заднина. Следно, треба да ја додадете вашата слика за позадина. Од опцијата позиција на слика, поставете ја позицијата на сликата со Врвен центар. Од опцијата за повторување, поставете ја опцијата не-повторување и големината како покривање на.

креирајте ефект на лизгање на сликата во Elementor

Сега префрлете се на јазичето напредни за да додадете сопствен CSS. Во полето Прилагодено CSS, додадете го следниов код:

селектор{
-webkit-transition: ease-in-out 3s !важно;
транзиција: лесно-во-излез 3s !важно;
}
избирач: лебди{
позадина-позиција: централно дно !важно;
}

Можете да ја промените вредноста на преодот за да го промените ефектот на лизгање на сликите. Ако сакате да додадете повеќе слики со ист ефект, можете да ја дуплирате колоната и потоа да ја промените сликата за заднина.

Заклучок

Следејќи го процесот, ќе можете да додадете ефект на лизгање на сликата на вашата веб-страница користејќи го создавачот на страници Elementor. Можете да ги проверите нашите други написи за да дознаете:

Се надеваме дека овој напис ќе ви биде корисен. Ако ви се допаѓа овој напис, ве молиме лајкнете ја нашата Фејсбук страница за да останете поврзани.

Споделете ја оваа статија:
Билтен
Добијте бесплатни совети и ресурси директно доставени до вашето сандаче.
Последни статии
☰ Брза навигација
0
Би сакале вашите мисли, ве молиме коментирајте.x

BloggersElite

Се добие бесплатно

Нашите упатства 

15987

Претплатете се на Нашите

Билтен

Добијте ги најновите совети доставени до вашето сандаче

15585