Патрэбен спосаб стварыць эфект пракруткі выявы факір ? У гэтым артыкуле мы раскажам вам, як стварыць эфект пракруткі выявы з дапамогай Elementor на вашых вэб-старонках.
Эфект пракруткі выявы дазволіць вам раскрыць выяву цалкам, калі карыстальнік наводзіць курсор на выявы. Калі вы наведваеце вэб-сайт, які прадае шаблоны вэб-сайтаў, вы можаце ўбачыць поўны папярэдні прагляд шаблонаў з функцыямі эфекту пракруткі выявы.
З дапамогай гэтых функцый вы можаце лёгка паказаць сваім карыстальнікам поўны выгляд вэб-сайта ў невялікай прасторы. Звычайна, калі вы хочаце адлюстраваць поўную выяву вэб-сайта, гэта зойме шмат месца на вашых вэб-старонках. Больш за тое, гэта ўплывае на дызайн вашага сайта.
Але з эфектам пракруткі малюнка вы можаце дадаць больш малюнкаў у прывабным выглядзе, які можа лёгка прыцягнуць увагу аўдыторыі.
Стварыце эфект пракруткі выявы ў Elementor
Elementor не забяспечвае віджэт для дадання эфекту пракруткі выявы. Такім чынам, вам трэба дадаць эфект з дапамогай карыстацкага CSS. Карыстальніцкая функцыя CSS даступная толькі з факір Pro. Так што пераканайцеся, што вы абнавіліся да факір Pro.
Цяпер адкрыйце старонку ў рэдактары Elementor і націсніце на значок плюса, каб дадаць раздзел.
Цяпер вам трэба выбраць слупок для вашага раздзела. Тут мы выбіраем раздзел з адным слупком.
Цяпер націсніце на значок рэдагавання раздзела і ва ўкладцы макета ўсталюйце мінімальную вышыню 500.
Цяпер з віджэта блока дадайце ўнутраны блок раздзела ў створаны раздзел і выдаліце слупок па змаўчанні. Пстрыкніце правай кнопкай мышы значок рэдагавання слупка і націсніце опцыю выдалення, каб выдаліць галоўны слупок.
Зноў перайдзіце да опцыі рэдагавання ўнутранага раздзела і ва ўкладцы макета ўсталюйце мінімальную вышыню 500, як мы паказалі раней.
Цяпер пераключыцеся на ўкладку стылю ўнутранага раздзела і ўсталюйце фон як класічны з опцыі фону. Далей вам трэба дадаць фонавы малюнак. У опцыі размяшчэння выявы ўсталюйце пазіцыю выявы па Лепшы цэнтр. З опцыі паўтору ўсталюйце опцыю не-паўтарыць і памер як вокладка.
Цяпер пераключыцеся на ўкладку прасунуты каб дадаць уласны CSS. У карыстальніцкае поле CSS дадайце наступны код:
селектар{ -webkit-transition: ease-in-out 3s !важна; пераход: лёгкасць унутры-выхад 3s !важна; } selector:hover{ background-position: center bottom !important; }
Вы можаце змяніць значэнне пераходу, каб змяніць эфект пракруткі малюнкаў. Калі вы хочаце дадаць некалькі малюнкаў з аднолькавым эфектам, вы можаце прадубляваць слупок, а потым змяніць фонавы малюнак.
заключэнне
Выконваючы гэты працэс, вы зможаце дадаць эфект пракруткі выявы на свой сайт з дапамогай канструктара старонак факір. Вы можаце праверыць нашы іншыя артыкулы, каб даведацца:
- Як выкарыстоўваць блокі Elementor у рэдактары Gutenberg?
- Elementor супраць Divi супраць SeedProd – што лепш?
- Як выкарыстоўваць гісторыю для адмены і паўтору дзеянняў у Elementor
- Як зрабіць сайт Elementor супер хуткім
- Як стварыць інтэрактыўны круг у Elementor
Мы спадзяемся, што гэты артыкул будзе вам карысная. Калі вам падабаецца гэты артыкул, упадабайце нашу старонку ў Facebook, каб заставацца на сувязі.
