Vaja on viisi pildi kerimise efekti loomiseks Elementor ? Selles artiklis juhendame teid oma veebilehtedel Elementori abil pildi kerimise efekti loomisel.
Pildi kerimise efekt võimaldab teil kuvada kogu pildi, kui kasutaja hõljutab kursorit piltide kohal. Kui külastate veebisaiti, mis müüb veebisaidimalle, näete mallide täielikku eelvaadet koos pildikerimise efekti funktsioonidega.
Nende funktsioonide abil saate hõlpsasti oma kasutajatele väikeses ruumis veebisaidi täielikku vaadet näidata. Tavaliselt, kui soovite kuvada veebisaidi täispilti, võtab see teie veebilehtedel palju ruumi. Lisaks mõjutab see teie veebisaidi kujundust.
Kuid pildi kerimise efektiga saate lisada rohkem pilte atraktiivsel viisil, mis võib hõlpsasti publiku tähelepanu köita.
Looge Elementoris pildikerimise efekt
Elementor ei paku vidinat pildi kerimisefekti lisamiseks. Seega peate efekti lisama kohandatud CSS-i abil. Kohandatud CSS-funktsioon on saadaval ainult koos Elementor Pro. Nii et veenduge, et olete versioonile üle läinud Elementor Pro.
Nüüd avage leht Elementori redaktoriga ja klõpsake jaotise lisamiseks plussikooni.
Nüüd peate valima oma jaotise veeru. Siin valime ühe veeru jaotise.
Nüüd klõpsake jaotise redigeerimise ikooni ja seadke paigutuse vahekaardil minimaalseks kõrguseks 500.
Nüüd lisage plokividinast loodud jaotisele sisemine jaotise plokk ja eemaldage vaikeveerg. Paremklõpsake veeru muutmise ikoonil ja klõpsake põhiveeru kustutamiseks kustutamisvalikut.
Minge uuesti sisemise jaotise redigeerimisvalikusse ja seadke paigutuse vahekaardil minimaalseks kõrguseks 500, nagu varem näitasime.
Nüüd lülituge sisemise sektsiooni stiili vahekaardile ja määrake taustvalikust taust klassikaliseks. Järgmiseks peate lisama oma taustapildi. Pildi asukoha valikust määrake pildi asukoht Ülemine keskus. Määrake kordusvalikust suvand ei-korda ja suurus nagu cover.
Nüüd lülitage vahekaardile edasijõudnud kohandatud CSS-i lisamiseks. Lisage kohandatud CSS-i väljale järgmine kood:
selektor{ -webkit-transition: easy-in-out 3s !important; üleminek: easy-in-out 3s !tähtis; } selector:hover{ background-position: center bottom !important; }
Saate muuta ülemineku väärtust, et muuta piltide kerimise efekti. Kui soovite lisada mitu sama efektiga pilti, saate veeru dubleerida ja seejärel taustapilti muuta.
Järeldus
Protsessi järgides saate lehe koostaja abil oma veebisaidile lisada pildi kerimise efekti Elementor. Õppimiseks võite vaadata meie teisi artikleid:
- Kuidas kasutada Elementori plokke Gutenbergi redaktoris?
- Elementor vs Divi vs SeedProd – kumb on parem?
- Kuidas kasutada ajalugu Elementori toimingute tagasivõtmiseks ja uuesti tegemiseks
- Kuidas teha Elementori veebisait ülikiireks
- Kuidas Elementoris interaktiivset ringi luua
Loodame, et see artikkel on teile kasulik. Kui teile see artikkel meeldib, siis palun like meie Facebooki lehele, et olla ühenduses.
