Wara websajts li jieħdu l-wisa ’kollu tal-iskrinAħna sibna li ċerti elementi jistgħu jiġu integrati li jistgħu jiġu utli biex juru kampjun sħiħ ta 'prodotti għall-bejgħ jew il-vjaġġi li jista' jkollna offruti għas-sajf. Il-karużelli jew is-slajders huma wieħed minn dawk l-elementi tal-web li jippermettulna nuru l-prodotti tagħna b'mod li jiġbed l-għajn ħafna.
Il- Sliders, scrollers jew karużelli b'xejn fis-CSS li ssib hawn taħt, jiffurmaw repertorju tajjeb għal kull tip ta 'objettivi fuq ix-xogħol li se nuru lill-klijent qabel ma jaċċettaw il-baġit tagħna. Hija ġabra ta 'sliders f'HTML u CSS bi ftit JavaScript f'format kemm orizzontali kif ukoll vertikali. Aħna se nagħmluha sabiex tkun tista 'taċċessa l-kodiċi biex timplimentahom malajr.
Dar
- 1 Karuselli orizzontali
- 2 Karusell infinit li jirrispondi
- 3 Irreaġixxi Carousel
- 4 Slider 3D lixx
- 5 Karużell infinit awtomatiku
- 6 Hover Carousel
- 7 Karużell Mobbli
- 8 Instagram Feed Carousel
- 9 Karużell sinkronizzat sempliċi
- 10 Karuselli orizzontali 3D
- 11 CSS Carousel
- 12 Ambilight Bootstrap Carousel
- 13 Tim tal-Karużell
- 14 Carousel Cube
- 15 Ċwievet tal-vleġġa tal-karużell
- 16 Karuselli vertikali
- 17 Karusell CSS pur
- 18 Il-karużell vertikali jirreaġixxi
- 19 3D Split Carousel
Karuselli orizzontali
Dan il-karużell jikkonsisti f ' animazzjoni pjuttost flashy bħallikieku konna npinġu purtiera, biex inħaffu biss għar-ritratti u l-ikoni tal-profili li se nistabbilixxu f'dan is-slider. Huwa karużell perfett għal testimonjanzi minn utenti li huma sodisfatti ħafna bil-prodotti li nbiegħu fuq il-web.
Karusell infinit li jirrispondi
Dan is-slider huwa bħar-reklamar li kultant jidher fuq l-għelieqi tal-futbol fuq il-ġnub u li juru reklami differenti li jiskrolljaw orizzontalment. Huwa ideali għall-inżul ta 'paġni li għandhom bżonn juru sħab tad-ditta u tipi oħra ta' logos.
Irreaġixxi Carousel
Dan l-iscroll tispikka għar-React.js tagħha. li jsellef lilu nnifsu biex juri immaġini f'qies proporzjonat hekk kif immorru minn immaġni għal oħra f'animazzjoni kontinwa. Ftit iktar xi ngħidu dwar dan is-CSS pjuttost sempliċi, imma ta 'effett kbir jekk nafu kif inpoġġiwh sewwa fuq il-web.
Slider 3D lixx
Kompost minn HTML, CSS u JavaScript, dan il-karużell 3D jispikka għall-intoppi u animazzjoni bouncing viżiva ħafna. B’serje ta ’elementi li jidentifikaw kull karta, xogħol u karużell li jiġbed l-għajn biex tinkorporaha fil-websajt tiegħek.
Karużell infinit awtomatiku
Slider li, kif iwissi ismu stess, jintwera awtomatikament mingħajr ma l-utent ikollu jinteraġixxi fl-ebda ħin miegħu. L-istampi differenti li jiffurmaw dan il-karużell impressjonanti jidhru minħabba t-tranżizzjoni li fiha tgħib magikament.
Hover Carousel
Bl-element imbagħad jerġa dan slider jimxi mix-xellug għal-lemin, jew viċi versa, hekk kif inħallu l-mouse pointer fuqu. Tranżizzjoni bla xkiel biex timxi bejn ir-ritratti differenti li jistgħu jikkomponu din is-slider tal-immaġni.
Karużell Mobbli
wkoll imsejjaħ Carousel Material Design, u max-xejra attwali ma 'kull tip ta' karti, hawn tista 'ssib artiklu ieħor b'numru kbir minnhom fis-CSS / HTML, tbiegħed mill-bqija għax huwa magħmul mil-lingwa tad-disinn ippubblikata mill-Google. Tista 'tmexxi l-karti differenti billi tagħfas fit-tul fuq il-karti.
Instagram Feed Carousel
Tista 'tiġrifa l-idea wara din is-slider li tenfasizza bi strixxa ta ’immaġini li jistgħu jitkabbru billi tikklikkja fuq waħda minnhom. Animazzjoni ta 'effett kbir, għalkemm hija diretta għal tip speċifiku ta' websajt. Postijiet ta 'Instagram meħuda f'karusell slick.js.
Karużell sinkronizzat sempliċi
Għandu ħafna x'jaqsam ma 'dak ta' qabel, speċjalment fl-istrixxa ta 'immaġini, għalkemm l-interazzjoni bis-slider hija differenti ħafna billi ċċaqlaqha b'ġest laterali mix-xellug għal-lemin u viċi versa. Għal darb'oħra għandna slick.js tagħmel ħaġa tagħha. Impressjonanti għall-effett kbir tagħha.
Karuselli orizzontali 3D
Wieħed mill-iktar karuselli interessanti fuq il-lista kollha li nippubblikaw. Jispikka għal is-slajders orizzontali tiegħek fis-CSS u l-HTML li jiċċaqalqu tajjeb ħafna. Trid tħalli biss il-mouse pointer fuq il-kaxxi biex issib l-effetti differenti li jistgħu jiġu prodotti bl-erba 'varjazzjonijiet.
CSS Carousel
Effett viżwali sempliċi u kbir b ' serje ta 'karti li jieħdu dawra fuq quddiem. L-effett huwa fit-3D, allura huwa wieħed minn dawk is-slajders li jiġbdu ħafna attenzjoni, speċjalment minħabba l-effett ta 'rebound minimu li juri ġenju min-naħa tal-kreatur tal-istess.
Ambilight Bootstrap Carousel
Slider sempliċi b'effett kbir li ma jispikkax għal ħafna. Huwa wieħed minn dawk is-sliders sempliċi li ġeneralment infittxu u li jagħti dik is-sensazzjoni li nkunu waħda mingħajr ħafna daqq, imma li tissodisfa perfettament il-funzjoni tagħha.
Tim tal-Karużell
Jekk trid tintroduċi t-tim editorjali li għandek fuq il-blog, din is-slider hija perfetta fir-rwol tagħha. Tajjeb simili għal dak ta 'qabel għal kemm hu sempliċi. Jispikka għall-użu tad-djamanti biex iżomm kull ritratt tat-tim. Għandu daqq awtomatiku.
Carousel Cube
Slider li jispikka minħabba li huwa kubu li fih kull waħda mill-uċuħ hija waħda mill-istampi jew ritratti li rridu nuru fuq websajt. Trid tikklikkja fuq kull waħda minnhom biex tiskrolljahom u ssir taf liema kontenut tistenna int.
Ċwievet tal-vleġġa tal-karużell
Slider li fih tgħaddi l-interazzjoni billi tuża l-vleġġa keys. Sempliċi mingħajr ħafna daqq li jmur direttament għal tip ieħor ta 'interazzjoni, waħda li tidher qisha snin ilu. Għal użu speċifiku.
Karuselli vertikali
Slider b'effett viżwali kbir li awtomatikament jilgħab f'animazzjoni vertikali kontinwa li tispikka għall-karti tagħha bil-kantunieri ttundjati. Kurrenti ħafna u waħda minn dawk li tispikka waħedha minn din il-lista sħiħa.
Karusell CSS pur
Dan il-karużell jispikka talli għandu menu sekondarju li minnu nistgħu mmorru tikklikkja fuq kull waħda mill-għażliet tagħha. L-informazzjoni tidher b'effett ta 'rebound miksub sew mingħajr ħafna iktar minn dak li ntqal.
Il-karużell vertikali jirreaġixxi
Simili għal preċedenti għall-vertikalità tagħha, għalkemm din is-slider hija kapaċi tieħu l-wisa 'kollha tal-paġna biex turi l-istampi ta' kull tabs tagħha. Interessanti għall-format kbir tagħha u l-użu ta 'transizzjonijiet CSS biex tiżżerżaq bejn is-slajds.
3D Split Carousel
Effett viżiv kbir b'disinn ta 'sliders li jduru f'3D bi animazzjoni impressjonanti ħafna. Tista 'tagħżel kull waħda mill-għażliet mill-menu tax-xellug b'punti għal kull waħda minnhom. Wieħed mill-aqwa fil-lista għal kemm hu kreattiv.
4 kummenti, ħalli tiegħek
Tajjeb, irrid nuża Pure CSS Carousel fuq is-sit tiegħi, iżda jinsab f'pożizzjoni waħda biss, kif nista 'nagħmilha tinsab fil-pożizzjoni li nixtieq fil-paġna tiegħi.
Jekk jogħġbok l-għajnuna tiegħek ma 'dan. Grazzi ħafna
Kif nista 'nagħmel il-Hover Carousel juri sew fuq il-verżjoni mobbli tal-websajt tiegħi?
Eċċellenti, x’xogħol tajjeb għamlu!
Hello, id-djar tal-ġarr huma friski ħafna, imma malli ntella ', nikkopjah u nippejjah, il-javascrip jagħtini żball minħabba l-var max = $ (' # c> li) .lenght ... X'qed tissuġġerixxi