Сүрөттү сыдыруу эффектин түзүүнүн жолу керек Elementor ? Бул макалада биз сизге веб-баракчаларыңызда Elementor аркылуу сүрөттү жылдыруу эффектин түзүүгө жардам беребиз.
Сүрөттү жылдыруу эффектиси колдонуучу сүрөттөрдүн үстүнөн курсорду көрсөткөндө толук сүрөттү ачууга мүмкүндүк берет. Вебсайттын шаблондорун саткан веб-сайтка киргениңизде, сүрөттөрдү жылдыруу эффектинин өзгөчөлүктөрү менен шаблондордун толук алдын ала көрүүсүн көрө аласыз.
Бул функциялар менен сиз колдонуучуларыңызга кичинекей мейкиндикте веб-сайттын толук көрүнүшүн оңой көрсөтө аласыз. Адатта, эгер сиз веб-сайттын толук сүрөтүн көрсөткүңүз келсе, ал веб-баракчаларыңызда көп орун ээлейт. Мындан тышкары, бул сиздин веб-сайтыңыздын дизайнына таасир этет.
Бирок сүрөттү жылдыруу эффекти менен сиз көрүүчүлөрдүн көңүлүн оңой тартып ала турган жагымдуу жол менен көбүрөөк сүрөттөрдү кошо аласыз.
Elementor ичинде сүрөт сыдырма эффектин түзүү
Elementor сүрөттү жылдыруу эффектин кошуу үчүн виджетти бербейт. Ошентип, сиз ыңгайлаштырылган CSS аркылуу эффектти кошушуңуз керек. Ыңгайлаштырылган CSS өзгөчөлүгү менен гана жеткиликтүү Elementor Pro. Андыктан жаңыртылганыңызды текшериңиз Elementor Pro.
Эми, Elementor редактору менен баракты ачып, бөлүм кошуу үчүн плюс белгисин басыңыз.
Эми сиз бөлүмүңүз үчүн тилкени тандооңуз керек. Бул жерде биз бир тилке бөлүмүн тандайбыз.
Эми бөлүмдү түзөтүү сөлөкөтүн чыкылдатып, макет өтмөгүндө минималдуу бийиктикти 500гө орнотуңуз.
Эми блок виджетинен өзүңүздүн түзүлгөн бөлүмүңүзгө ички бөлүм блогун кошуп, демейки тилкени алып салыңыз. Мамычаны түзөтүү сөлөкөтүн оң баскыч менен чыкылдатыңыз жана негизги тилкени жок кылуу үчүн жок кылуу опциясын басыңыз.
Ички бөлүмдүн түзөтүү опциясына кайра барып, макет өтмөгүндө биз мурда көрсөткөндөй, минималдуу бийиктикти 500 деп коюңуз.
Эми ички бөлүмдүн стилдер өтмөгүнө өтүп, фон опциясынан фонду классикалык кылып коюңуз. Андан кийин, сиз фон сүрөтүңүздү кошушуңуз керек. Сүрөттүн ордун тандоосунан сүрөттүн ордун коюңуз Жогорку борбор. Кайталоо опциясынан параметрди орнотуңуз кайталанбоо жана өлчөмү сыяктуу жабуу.
Азыр өтмөккө өтүңүз алдынкы ыңгайлаштырылган CSS кошуу үчүн. Ыңгайлаштырылган CSS талаасында төмөнкү кодду кошуңуз:
селектор{ -webkit-өтүү: жеңил-кирүү 3s !маанилүү; өтүү: жеңилдик 3с !маанилүү; } селектор:hover{ background-position: центрдин түбү !important; }
Сүрөттөрдүн сыдырма эффектин өзгөртүү үчүн өтүү маанисин өзгөртө аласыз. Эгер сиз бир эле эффект менен бир нече сүрөттөрдү кошкуңуз келсе, тилкени кайталап, андан кийин фон сүрөтүн өзгөртө аласыз.
жыйынтыктоо
Процессти аткаруу менен, сиз баракча куруучу аркылуу веб-сайтыңызга сүрөт сыдырма эффектин кошо аласыз Elementor. Сиз биздин башка макалаларды окуп үйрөнө аласыз:
- Гутенберг редакторунда Elementor блокторун кантип колдонсо болот?
- Elementor vs Divi vs SeedProd – Кайсынысы жакшы?
- Elementorдогу аракеттерди жокко чыгаруу жана кайра жасоо үчүн тарыхты кантип колдонсо болот
- Кантип Elementor веб-сайтын супер тез жасоо керек
- Элементордо интерактивдүү чөйрөнү кантип түзүү керек
Бул макала сиз үчүн пайдалуу болот деп үмүттөнөбүз. Бул макала сизге жакса, байланышта болуу үчүн Facebook баракчабызга лайк басыңыз.
Макалалар
- JetElements: сонун виджеттери бар сонун Elementor кошумчасы
- Elementor үчүн 22 мыкты премиум кошумчалары
- Elementor vs Beaver Builder: Бет куруучулардын деталдуу салыштыруусу
- Elementor Review 2024: Elementor менен болгон тажрыйба (жакшы жактары, кемчиликтери, өзгөчөлүктөрү жана башкалар)
- Элементордо интерактивдүү чөйрөнү кантип түзүү керек
- Кантип Elementor веб-сайтын супер тез жасоо керек: Толук окуу куралы
- Сайтты Elementor Cloudка кантип көчүрүү керек
- Elementor үчүн 5 мыкты Instagram канал плагиндери [Биздин эң мыкты тандоолор]