35 menus ee HTML iyo CSS

menu

Qormooyinkan taxanaha ah ee leh lAragtiyo la xushay oo ku saabsan CSS, HTML iyo lambarka JavaScript, waxaan badanaa wadaagnaa saamaynta qoraalka, fallaaraha, madaxa ama kuwa isdaba-joogga ah ee lagu xoojinayo naqshadeynta degelkeenna si ay uga qurux badnaato ama awood u leedahay inay ku darto qiimeynta waxyaabaha aan u soo bandhigno booqdaha.

Markan waa waqtigii loogu talagalay menus ee HTML iyo CSS oo aad ku noolaan karto si ku filan kuwa walxaha muhiimka ah ee noo oggolaanaya inaan ku toosinno adeegsadaha qaybaha ugu muhiimsan ee eCommerce, blog iyo wixii intaa ka badan. Waxaan u raaceynaa iyaga si aan u siino taabashadaas bartayada iyo in ay tahay sida ugu macquulsan heerarka naqshadeynta UI.

Xullo liiska 'accordion'

Hamburger

Un liiska batoonka ama menu hamburger oo ka kooban animations nimco leh taabasho yar oo saameyn weyn leh.

Maqaalka laxiriira:
9 menus CSS dhinaceeda ma waayi kartid

Swanky Pure CSS ayaa hoos u dhacaya

Swanky

Swanky Lil Drop Manu V2.0 es menu si fiican u dhameystir CSS saafi ah taas oo leh qiime dheeri ah oo ah in uusan jirin lambarka JavaScript gabi ahaanba ku-xirnaanta adeegsadaha. Si fudud ufiican iskudhafkeeda si loo ogaado xarrago weyn

Menu muxaadaro

Qalabaynta

Este liiska miiska es aad u fudud hadaan isbarbar dhig ku sameyno labadii hore HTML, JS iyo CSS.

Maqaalka laxiriira:
16 menus cascading ee CSS si dib loogu habeeyo websaydhkaaga

Liiska taagan oo leh jQuery iyo CSS3

Axdi toosan

Un menu toosan oo leh jQuery iyo CSS3 de taabasho weyn oo app ah ama degel Dhammaan noocyada kala-guurka iyo jiheeyaha leh hooska ugu yar.

Liiska wareega

Wareeg wareeg ah

Un menu wareegsan de marin tijaabo ah kaas oo si fiican ugu shaqeeya degel farsamo. Lagu soo saaray SVG iyo Platform Animation GreenSock, way ka duwan yihiin shaki la'aan.

Liiska Radial

Radial

Kuwa kale radial menu oo tijaabo ah taas oo si qumman u ansaxaysa bog loogu talagalay ciyaar.

Wareegtada CSS HTML menu

Wareega

Un menu wareegsan CSS HTML in la dhigo dhinaca dambe iyo taas wuxuu u furaa si wareeg ah leh khibrad weyn oo isticmaale.

Fikradda menu giraanta

Wareegyo

Arrintan giraanta menu ka links waa la taagan yahay mid kasta dusheeda si loo sameeyo siddooyin kala duwan.

Ubax soo baxa menu

ubaxa

Wax kale oo gaar ah menu-pop-up oo leh animation si aad u wanaagsan loo adeegsado oo soo saaraya saameyn weyn.

Nasashada Hover Nav

Soo noqnoqda

Nasashada Hover Nav waa a tayo sare leh hoos u dhig liiska loogu talagalay animations-yadaas oo si dhammaystiran u tilmaamaya qaab-dhismeedka waxa ku jira shabakadda.

Drop navigation

CSS

Un liiska hoos u dhigista la mid ah kii hore inkasta oo ay la socdaan nashqado kale oo ku jira nashqadda is-dhexgalka.

Nadiifinta liiska CSS

CSS fudud oo Saafi ah

Kuwa kale tayada liistada liiska CSS kaas oo raacaya heerarka naqshadeynta UI ee hadda jira.

Liiska jawaabta iyo fudud

Jawaab fudud

shaashad buuxda, tan menu ka jawaabaya oo fudud HTML5 iyo CSS3 waxay la jaan qaadayaan Internet Explorer 11.

Liiska shaashadda oo buuxa ee SVG

Liiska buuxa SVG

Un menu shaashad buuxda ee SVG oo la dhigay dhinaca hamburger waana mid indhaha soo jiidanaysa.

CSS Menu ee Mega

Meen Menu

Un Meen Menu ee CSS iyo HTML ka duwan waxa la arko, oo leh qaab casri ah oo aad u yar.

Fikrad kale oo menu ah

Fikradda liiska

Fikrad kale oo menu ah waa ikhtiyaarka ugu habboon haddii waxaad raadineysaa menu ka duwan kan asalka ahMidkani waa mid aad ugu mahadcelinaya menu-ga caadada u ah astaanta iyo animation si xamaasad leh loo hindisay

Maqaalka Naqshadeynta Maaddada

Waxyaabaha

Maqaalka Naqshadeynta Maaddada waa ku saleysan luqadda naqshadeynta Google. 

Burger menu-ga

Burger

Un hamburger menu mobile filaayo iyo in lagu sameeyo HTML, CSS iyo JavaScript.

Velocity.js Flexbox sanduuqa buuxa

xawaaraha

Velocity.js Flexbox sanduuqa buuxa waa menu ah tayada weyn ee saameynta la gaadhay iyo waayo-aragnimadeeda isticmaale ee ugu dhow. Flexbox shaashad buuxda leh xawaare.js.

Bog buuxa oo ka baxsan shiraac

Bog buuxa

Bog buuxa oo ka baxsan shiraac waa tayo sare leh, shaashad shaashad buuxda leh oo si fiican ugu shaqeysa soo bandhigida sida loo sameeyo shabakad qiyamkaas.

Hover saamaynta liiska menu

dulsaar

Un hover menu saameyn khad fudud oo aad u fiican.

CSS fikradda menu-clip-path

CSS Fikradda Maqaalka

Fikrad kale oo ah menu leh clip-path oo ka kooban hover aad u xiisa badan iyo qaar ka mid ah qaybaha animated.

Gawaarida Strikethrough

joojinta

Gawaarida Strikethrough waa menu kale dul istaag isku xirnaanta xiisaha leh Natiijada

Liistada Lavalamp CSS

Lavalamp

Liistada Lavalamp CSS waxaa ku jira a dhaqdhaqaaq animation mid kasta oo ka mid ah xiriiriyeyaasha taasi waxay isu dhiibaysaa firfircoonaan.

Iskuduwaha socodka

Nadiifi Slider

Un slider marinka taas oo ku duuban xiriir kasta in lagu garto midab casaan leh iyo animation si fiican loo daryeelay oo natiijooyin fiican leh.

Wareegtada moobaylka

Liiska moobaylka

Un Burger menu navigation saameyn weyn oo loogu talagalay qalabka moobiilka.

IPhone X fikradda menu-ka moobiilka

iPhone X

 

Un menu loogu talagalay iPhone X taasi waxay ku siin kartaa boggaaga taabashada tayada u dhigma naqshadda taleefanka Apple.

Submenu balaadhi mobilka

Submenu balaadhi

Submenu balaadhi mobilka waxaa loogu talagalay cagta la animation nimco iyo barakac aad u haboon. Elegance dhammaan heerarka loogu talagalay isugeynta moobiilka ee abkaaga ama boggaaga.

Dhaqdhaqaaqa wareega ee mobilada

Nolosha

Kuwa kale menu animated loogu talagalay mobilada leh taariikh wareeg ah oo animated leh natiijooyin muuqaal oo weyn.

Liistada leh rogrogmada iyo hoos udhaca saameynta

Wareeji Hover

Kuwa kale saameyn weyn u leh menu ka duwan oo jilicsan. Bari menu la rogrogmadaan iyo hoos saamaynta waxay ku habboon tahay makhaayadaha, dib u eegista, iyo inbadan.

Liiska moobaylka

filter

Un shaandhada menu mobile loo beddelay nooca webka oo loogu talagalay moobilka.

Bixinta maraakiibta ka baxsan

Off-shiraac

Bixinta maraakiibta ka baxsan Waa menu in tijaabi kala-guurka iyo hagidda inuu ahaado mid aad u taagan. Haddii aad raadineyso wax cusub oo aad la yaabto, heerkeedu waa kan ugu fiican liiskan.

Qarsoon CSS menu

Menu qarsoon

Un menu menu ee CSS maxaa qarsoon oo sidaas ayay ku muuqataa astaanta hamburger.

Dhinac dhinac socodka ah oo go'an

go'an

Adeegso bootstrap halkii Flexbox si loo taageero IE9 / 10. Liis kale oo heer sare ah oo loogu talagalay Dhinac dhinac socodka ah oo go'an fikradeeda.

Morphing tab

Morphing

Morphing tab waa menu hoos u dhac ku yimaada markaad wax riixdo badhanka tabka weyn.


Nuxurka maqaalka wuxuu u hogaansamayaa mabaadi'deena anshaxa tifaftirka. Si aad u soo sheegto khalad guji Halkan.

2 faallooyin, ka tag taada

Ka tag faalladaada

cinwaanka email aan la daabacin doonaa. Beeraha loo baahan yahay waxaa lagu calaamadeeyay la *

*

*

  1. Masuul ka ah xogta: Miguel Ángel Gatón
  2. Ujeedada xogta: Xakamaynta SPAM, maaraynta faallooyinka.
  3. Sharci: Oggolaanshahaaga
  4. Isgaarsiinta xogta: Xogta looma gudbin doono dhinacyada saddexaad marka laga reebo waajibaadka sharciga ah.
  5. Kaydinta xogta: Macluumaadka ay martigelisay Shabakadaha Occentus (EU)
  6. Xuquuqda: Waqti kasta oo aad xadidi karto, soo ceshan karto oo tirtiri karto macluumaadkaaga.

  1.   Javier dijo

    Waad salaaman tihiin waxaan ka helay liiska kala geddisan ee laga heli karo boggan mid aad u xiiso badan, su'aashaydu waxay tahay sidee baad u rakibtaa faylasha js ee meeniska? dhowr jeer ayaan isku dayay inaan dhiso menu kasta kuwa js aan shaqeynin, ama aan rakibi karin, kormeerida walxaha biraawsarka waxay oraneysaa shaqada marka hore soo muuqata lama qeexin sidaas darteed dhammaan liiska

  2.   Eduardo dijo

    Wax ku biirinta wanaagsan :)