19 csúszka vagy körhinta CSS és HTML az Ön weboldalához

Azáltal, hogy a képernyő teljes szélességét elfoglaló webhelyekMegállapítottuk, hogy egyes elemek integrálhatók, amelyek jól jöhetnek az eladható termékek teljes mintájának vagy a nyárra kínált utak teljes megjelenítéséhez. A körhinta vagy a csúszka egyike azoknak a webes elemeknek, amelyek lehetővé teszik számunkra, hogy termékeinket nagyon szemet gyönyörködtető módon mutassuk meg.

sok Ingyenes csúszkák, görgetők vagy körhinta CSS-ben amelyet alább talál, jó repertoárt kínálnak mindenféle munkahelyi célkitűzéshez, amelyeket megmutatunk az ügyfélnek, mielőtt elfogadják a költségvetésünket. Ez egy csúszkagyűjtemény HTML és CSS formában, egy kis JavaScript-rel vízszintes és függőleges formátumban is. Azért fogjuk megtenni, hogy Ön elérhesse a kódot a gyors végrehajtáshoz.

Vízszintes körhinta

Ez a körhinta a elég mutatós animáció mintha függönyt húznánk, hogy csak kicsinyítsük azokat a profilok fotóit és ikonjait, amelyeket ebben a csúszkában fogunk létrehozni. Ez egy tökéletes körhinta azoknak a felhasználóknak az ajánlásaihoz, akik nagyon elégedettek az általunk az interneten értékesített termékekkel.

Kapcsolódó cikk:

27 HTML- és CSS-csúszka, amelyek a weboldaladnak olyan különleges érzetet adnak

Reszponzív végtelen körhinta

Ez a csúszka az mint a néha látható reklám az oldalsó futballpályákon, és vízszintesen görgethető különféle hirdetéseket jelenít meg. Ideális olyan nyitóoldalakhoz, ahol márkapartnereket és más típusú logókat kell bemutatni.

Reagáljon körhintát

Ez a tekercs kiemelkedik React.js-jével. Ez alkalmas arra, hogy a képeket arányos méretben jelenítsük meg, miközben folyamatosan haladunk egyik képről a másikra. Kevesebb mondanivaló erről a meglehetősen egyszerű CSS-ről, de nagy hatással van, ha tudjuk, hogyan helyesen helyezzük el az interneten.

Sima 3D csúszka

A HTML-ből, CSS-ből és JavaScript-ből álló 3D-s körhinta sima és rendkívül vizuálisan pattogó animáció. Az egyes kártyákat azonosító elemek sorozatával egy mű és egy figyelemfelkeltő körhinta, amely beépíti azokat a webhelyére.

Kapcsolódó cikk:

46 Javascript csúszkák és görgők

Automatikus végtelen körhinta

Egy csúszka, amely - amint a saját neve figyelmeztet - automatikusan megjelenik anélkül, hogy a felhasználónak kölcsönhatásba kellene lépnie nincs idő vele. A különböző képek, amelyek ezt a feltűnő körhintát alkotják, az átmenet miatt jelennek meg, amelyben varázslatosan elhalványul.

Lebegő körhinta

A lebegő elemmel ezt csúszka balról jobbra mozog, vagy fordítva, amikor az egérmutatót rajta hagyjuk. Zökkenőmentes átmenet a képcsúszkát alkotó különböző fotók között való mozgáshoz.

Mobil körhinta

is Carousel Material Design néven, és a jelenlegi trend mindenféle kártyával, itt található egy másik cikk, nagy számmal CSS / HTML-ben, elhatárolódik a többitől azzal, hogy a Google által közzétett tervezési nyelvből áll. A kártyákat hosszan megnyomva mozgathatja a különböző kártyákat.

Instagram Feed Carousel

Összetörheti ennek a kiemelő csúszkának az ötletét nagyítható képcsíkkal az egyikre kattintva. Nagy hatású animáció, bár egy adott típusú weboldalra készült. Az Instagram-bejegyzések egy slick.js körhinta felé kerültek.

Egyszerű szinkronizált körhinta

Nagyon sok köze van az előzőhöz, főleg a képcsíkokban, bár a csúszkával való kölcsönhatás nagyon eltérő oldalirányú mozdulattal balról jobbra és fordítva. Ismét a slick.js teszi a dolgát. Feltűnő a nagy hatása miatt.

3D vízszintes körhinta

Az általunk közzétett lista egyik legérdekesebb körhinta. Kiáll a vízszintes csúszkákat CSS-ben és HTML-ben hogy fantasztikusan jól mozognak. Csak az egérmutatót kell hagynia a négyzetek felett, hogy megtalálja a négy variációval előállítható különböző effektusokat.

CSS körhinta

Egyszerű és nagyszerű vizuális effektus a váltakozó kártyasorozat elöl. A hatás 3D-ben jelenik meg, így azok közé a csúszkák közé tartozik, amelyek sok figyelmet vonzanak, különösen a minimális visszapattanó hatás miatt, amely zsenialitást mutat ugyanazon alkotó részéről.

Ambilight Bootstrap körhinta

Egyszerű csúszka, nagyszerű hatással, amely nem tűnik túl soknak. Egyike a azokat az egyszerű csúszkákat amit általában keresünk, és ez azt az érzést kelti bennünk, hogy különösebb rajongás nélkül egyek vagyunk, de ez tökéletesen teljesíti a funkcióját.

Körhinta csapat

Ha meg akarja mutatni a szerkesztőséget, amely a blogon van, ez a csúszka tökéletes a szerepében. Jó, mint az előző, hogy mennyire egyszerű. Kiemelkedik a gyémántok használatával a csapat minden fényképének elhelyezéséhez. Automatikus lejátszással rendelkezik.

Körhinta kocka

Csúszka, amely kiemelkedik azzal, hogy egy kocka, amelyben az arcok mindegyike az egyik kép vagy fényképeket, amelyeket egy weboldalon szeretnénk megjeleníteni. Csak rájuk kell kattintani, hogy görgethesse őket, és megtudja, milyen tartalmak várnak rád.

Körhinta nyíl billentyűk

Egy csúszka, amelyen keresztül zajlik az interakció a nyílbillentyűk segítségével. Egyszerű, sok rajongás nélkül, amely közvetlenül egy másik típusú interakcióhoz vezet, amely évekkel ezelőtt tűnik. Meghatározott felhasználásra.

Függőleges körhinta

Egy csúszka, nagyszerű vizuális effektussal automatikusan folytonos függőleges animációban játszik amely lekerekített sarkú kártyáival tűnik ki. Nagyon aktuális és az egyik, amely önmagában is kiemelkedik ebből a teljes listából.

Tiszta CSS körhinta

Ez a körhinta kiemelkedik azzal, hogy a oldalsó menü, ahonnan mehetünk az egyes lehetőségekre kattintva. Az információk jól elért visszapattanó hatással jelennek meg, annál sokkal többet, mint amit mondtak.

Függőleges körhinta reagál

Hasonló a előző a függőlegessége miatt, bár ez a csúszka képes az oldal teljes szélességét figyelembe venni az egyes fülek képeinek megjelenítéséhez. Érdekes a nagy formátum és a CSS átmenetek használata a diák közötti csúsztatáshoz.

3D osztott körhinta

Nagyszerű vizuális effektus csúszka mintával, amely 3D-ben forog nagyon frappáns animáció. A bal oldali menüből kiválaszthatja az egyes lehetőségeket, mindegyikhez pontokkal. A lista egyik legjobbja, hogy mennyire kreatív.