Nipa nini awọn oju opo wẹẹbu ti o gba gbogbo iwọn iboju naaA rii pe awọn eroja kan le ṣepọ ti o le wa ni ọwọ lati ṣe afihan gbogbo ayẹwo awọn ọja fun tita tabi awọn irin-ajo ti a le ni lori ipese fun igba ooru. Carousels tabi awọn ifaworanhan jẹ ọkan ninu awọn eroja wẹẹbu wọnyẹn ti o gba wa laaye lati ṣe afihan awọn ọja wa ni ọna mimu oju pupọ ni wiwo.
Los Awọn ifaworanhan ọfẹ, awọn apanirun tabi awọn carousels ni CSS pe iwọ yoo wa ni isalẹ, wọn ṣe iwe-iranti ti o dara fun gbogbo iru awọn ibi-afẹde ni iṣẹ ti a yoo fi han alabara ṣaaju ki wọn to gba isunawo wa. O jẹ ikojọpọ awọn ifaworanhan ni HTML ati CSS pẹlu diẹ ninu JavaScript ni ọna petele ati ọna kika. Jẹ ki a ṣe ki o le wọle si koodu lati ṣe wọn ni kiakia.
Atọka
- 1 Awọn carousels petele
- 2 Idahun ailopin carousel
- 3 Ṣe atunṣe Carousel
- 4 Dan 3D Slider
- 5 Laifọwọyi ailopin Laifọwọyi
- 6 Rababa Carousel
- 7 Mobile Carousel
- 8 Carousel Instagram kikọ sii
- 9 Carousel amuṣiṣẹpọ ti o rọrun
- 10 3D petele carousels
- 11 CSS Carousel
- 12 Ambilight Bootstrap Carousel
- 13 Ẹgbẹ Carousel
- 14 Carousel Kuubu
- 15 Awọn bọtini itọka Carousel
- 16 Awọn carousels inaro
- 17 CSrous Carousel mimọ
- 18 Inaro carousel fesi
- 19 3D Pin Carousel
Awọn carousels petele
Carousel yii ni a lẹwa flashy iwara bi ẹni pe a ya aṣọ-ikele kan, lati kan sun sita fun awọn fọto ati awọn aami ti awọn profaili ti a yoo fi idi mulẹ ni yiyọ. O jẹ carousel pipe fun awọn ijẹrisi lati ọdọ awọn olumulo ti o ni itẹlọrun pupọ pẹlu awọn ọja ti a ta lori oju opo wẹẹbu.
Idahun ailopin carousel
Yiyọ yii jẹ bii ipolowo ti o le rii nigbakan lori awọn aaye bọọlu afẹsẹgba ni awọn ẹgbẹ ati fifihan awọn ipolowo oriṣiriṣi ti o yipo ni petele. O jẹ apẹrẹ fun awọn oju-iwe ibalẹ ti o nilo lati ṣe afihan awọn alabaṣepọ ami iyasọtọ ati awọn iru awọn aami apẹẹrẹ miiran.
Ṣe atunṣe Carousel
Yiyi duro fun React.js. ti o ya ararẹ si fifihan awọn aworan ni iwọn ti o yẹ bi a ṣe nlọ lati aworan kan si ekeji ni idanilaraya lemọlemọfún. Diẹ diẹ sii lati sọ nipa CSS ti o rọrun yii, ṣugbọn ti ipa nla ti a ba mọ bi a ṣe le ipo rẹ daradara lori oju opo wẹẹbu.
Dan 3D Slider
Ti o ni HTML, CSS ati JavaScript, carousel 3D yii duro jade fun didanu rẹ ati iwara bouncing pẹlu ipa wiwo nla. Pẹlu lẹsẹsẹ awọn eroja ti o ṣe idanimọ kaadi kọọkan, iṣẹ ati carousel mimu oju lati ṣafikun rẹ lori oju opo wẹẹbu rẹ.
Laifọwọyi ailopin Laifọwọyi
Ẹyọ kan ti, bi orukọ tirẹ ti kilọ, ti han laifọwọyi laisi olumulo ti o ni ibaraenisepo ni akoko kankan pẹlu rẹ. Awọn oriṣiriṣi awọn aworan ti o ṣe carousel idaṣẹ yii han nitori iyipada ninu eyiti o jẹ ki idan rẹ bajẹ.
Rababa Carousel
Pẹlu eroja rababa yii esun yipo lati osi si otun, tabi idakeji, bi a ṣe fi itọka asin silẹ lori rẹ. Iyipo dan lati gbe laarin awọn fọto oriṣiriṣi ti o le ṣajọ esun aworan yii.
Mobile Carousel
Bakannaa ti a pe ni Apẹrẹ Ohun elo Carousel, ati pẹlu aṣa lọwọlọwọ pẹlu gbogbo awọn kaadi, nibi o le wa nkan miiran pẹlu nọmba nla ninu wọn ni CSS / HTML, jinna si ara rẹ nitori iyoku nitori pe o ni ede apẹrẹ ti Google gbejade. O le gbe awọn kaadi oriṣiriṣi lọ nipasẹ titẹ gigun lori awọn kaadi naa.
Carousel Instagram kikọ sii
O le jamba imọran lẹhin ifaworanhan fifihan yii nipasẹ rinhoho ti awọn aworan ti o le ṣe afikun nipa tite lori ọkan ninu wọn. Iwara ti ipa nla, botilẹjẹpe o tọka fun iru oju opo wẹẹbu kan pato. Awọn ifiweranṣẹ Instagram ti o ya si slick.js carousel.
Carousel amuṣiṣẹpọ ti o rọrun
O ni ọpọlọpọ lati ṣe pẹlu iṣaaju, ni pataki ni awọn aworan ti awọn aworan, botilẹjẹpe ibaraenisepo pẹlu esun jẹ oriṣiriṣi pupọ nipa gbigbe e pẹlu idari ti ita lati apa osi si otun ati ni idakeji. Lẹẹkansi a ni slick.js n ṣe nkan rẹ. Ijakadi fun ipa nla rẹ.
3D petele carousels
Ọkan ninu awọn carousels ti o nifẹ julọ lori gbogbo atokọ ti a tẹjade. Duro jade fun awọn ifaworanhan petele rẹ ni CSS ati HTML ti o gbe ni ikọja daradara. O ni lati fi itọka eku silẹ nikan lori awọn apoti lati wa awọn ipa oriṣiriṣi ti o le ṣe pẹlu awọn iyatọ mẹrin.
CSS Carousel
Ipa oju wiwo ti o rọrun ati nla pẹlu kan jara ti awọn kaadi ti o ya wa lori iwaju. Ipa naa wa ni 3D, nitorinaa o jẹ ọkan ninu awọn ifaworanhan wọnyẹn ti o fa afiyesi pupọ, paapaa nitori ipa ipadabọ kekere ti o fihan oloye-pupọ ni apakan ti ẹlẹda kanna.
Ambilight Bootstrap Carousel
Isokuso ti o rọrun pẹlu ipa nla ti ko duro fun pupọ. Jẹ ọkan ninu awon ti o rọrun sliders pe a maa n wa ati iyẹn n fun rilara yẹn ti ọkan laisi ayẹyẹ pupọ, ṣugbọn iyẹn mu iṣẹ rẹ ṣiṣẹ daradara.
Ẹgbẹ Carousel
Ti o ba fẹ ṣafihan egbe olootu ti o ni lori bulọọgi, yiyọ yi jẹ pipe ninu ipa rẹ. O dara iru si iṣaaju fun bi o ṣe rọrun. O wa jade fun lilo awọn okuta iyebiye lati fi ile si awọn fọto kọọkan ti ẹgbẹ. O ni ṣiṣiṣẹsẹhin aifọwọyi.
Carousel Kuubu
Yiyọ ti o duro fun jijẹ onigun ninu eyiti ọkọọkan awọn oju jẹ ọkan ninu awọn aworan tabi awọn fọto ti a fẹ ṣe afihan lori oju opo wẹẹbu kan. O kan ni lati tẹ lori ọkọọkan wọn lati yi lọ wọn ki o wa iru akoonu ti n duro de ọ.
Awọn bọtini itọka Carousel
Ifaworanhan kan ninu eyiti ibaraenisepo n kọja lilo awọn bọtini itọka. Rọrun laisi igbadun pupọ ti o lọ taara si iru ibaraenisepo miiran, ọkan ti o dabi awọn ọdun sẹhin. Fun kan pato lilo.
Awọn carousels inaro
Yiyọ kan pẹlu ipa wiwo nla pe laifọwọyi yoo ni a lemọlemọfún iwara inaro ti o duro fun awọn kaadi rẹ pẹlu awọn igun yika. Gan lọwọlọwọ ati ọkan ninu awọn ọkan ti o duro ni ara rẹ lati gbogbo atokọ yii.
CSrous Carousel mimọ
Carousel yii duro fun nini kan akojọ aṣayan ẹgbẹ lati eyiti a le lọ tite lori awọn aṣayan kọọkan. Alaye naa han pẹlu ipa ipadasẹyin ti aṣeyọri daradara laisi pupọ diẹ sii ju ohun ti a sọ lọ.
Inaro carousel fesi
Iru si ti tẹlẹ fun inaro rẹ, botilẹjẹpe yiyọ yii lagbara lati mu gbogbo iwọn oju-iwe naa lati fihan awọn aworan ti ọkọọkan awọn taabu rẹ. Nifẹ fun ọna kika nla rẹ ati lilo awọn iyipada CSS lati rọra yọ laarin awọn ifaworanhan.
3D Pin Carousel
Ipa wiwo nla pẹlu apẹẹrẹ awọn kikọja ti o yipo ni 3D pẹlu iwara pupọ. O le yan ọkọọkan awọn aṣayan lati inu akojọ aṣayan apa osi pẹlu awọn aami fun ọkọọkan wọn. Ọkan ninu ti o dara julọ lori atokọ fun bii o ṣe ṣẹda.
Awọn asọye 4, fi tirẹ silẹ
Ni owurọ, Mo fẹ lati lo CSS Carousel Pure lori aaye mi, ṣugbọn o wa ni ipo kan nikan, bawo ni MO ṣe le ṣe ki o wa ni ipo ti Mo fẹ laarin oju-iwe mi.
Jọwọ iranlọwọ rẹ pẹlu eyi. O ṣeun pupọ
Bawo ni MO ṣe le ṣe ifihan Hover Carousel daradara lori ẹya alagbeka ti oju opo wẹẹbu mi?
O dara julọ, iṣẹ wo ni wọn ṣe!
Kaabo, awọn ile gbigbe ni itura pupọ, ṣugbọn ni kete ti Mo gbejade, Mo daakọ ati lẹẹ mọ, javascrip fun mi ni aṣiṣe nitori var max = $ ('# c> li) .lenght…. Kini o daba