41 ókeypis CSS hnappar með smá JavaScript

Ókeypis CSS hnappar

Við höldum áfram með aðra grein í röðinni af HTML, CSS og JavaScript sem færir a ágætur lista yfir kóða til að leggja áherslu á með sjónrænt útlit eða notendaupplifun á vefsíðu okkar; hvort sem það er rafræn viðskipti, lendingarsíða eða bloggið sjálft.

Það snertir augnablikið að öðrum af þessum mikilvægu þáttum sem eru færir um hringja í aðgerðir þannig að táknið sem færir notandann í innkaupakörfuna, hnappana, verða að kaupum. CSS hnapparnir sem þú munt finna hér að neðan eru ókeypis og samanstanda af þrívíddar hnappar, til að tengjast félagslegum netum, til að deila, til að fara aftur í upphafið eða til að opna sem og aðra.

3D hnappur

3D hnappur

Þrívíddarhnappur sem stendur upp úr fyrir dýptina sem það veldur hvar sem við förum til að setja það með þessum skyggingaráhrifum sem gera hvert sjónrænt frumefni áberandi.

Þrívíddarhnappur til að ýta á

Þrívíddarhnappur til að ýta á

þetta 3D hnappur í CSS Það hefur getu til að hreyfimyndin byrji að keyra þegar við lengjum púlsunina á því.

Afturhnappur

Afturhnappur

Þessi CSS hnappur mun taka okkur efst á vefsíðu okkar þegar við höfum farið í gegnum það.

Kúluhnappur

Kúluhnappur

Kúluhnappur í CSS og JavaScript sem þegar smellt er á hann mun skvetta með röð af loftbólum með sláandi og viðeigandi fjör.

Bæta við hnapp

Bæta við hnapp

a tignarlegt fjör hleypir lífi í þennan hnapp til að bæta við í CSS sem getur verið einn af þeim þáttum sem láta vefsíðu okkar skera sig úr.

CSS Offset hnappur

Offset

Svipað og það fyrra, þó með aðeins öðruvísi fjör. Það getur verið tilvalið fyrir röð vefsíðna um ákveðið þema.

Hnappalokun

Loka

Við ýtum á þetta hnappur í CSS og HTML fyrir að loka fjör verði framleidd. Einfalt, en með mikla sjónræna áhrif.

CSS lokahnappur

CSS lokahnappur

Á þeim tíma sem skiljum eftir músarbendilinn Á þessum lokahnappi getum við fundið út gæðafjör sem við munum samþætta á vefnum.

CSS niðurhalshnappur

CSS niðurhalshnappur

Ef við höfum efni til að hlaða niður á vefsíðu okkar er mikilvægt að við höfum viðeigandi hnapp fyrir notandann til að fá rétt fljótt á púlsinum. Þessi hnappur stendur upp úr þegar ýtt er á hann og sleppt slatta af litlum áföllum í vel gert fjör.

Niðurhalshnappur

Niðurhalshnappur

Þessi hnappur sérhæfir sig í hreyfimyndum fyrir lyfta litlum bolta sem færist frá annarri hliðinni á stikunni yfir á hina til að láta okkur varpa ljósi á aðgerðina sem notandinn tekur þegar hann smellir á niðurhalið.

Sækja hnappinn fjör

Niðurhal hreyfimynda

a ansi langt fjör fyrir hnapp, en það getur verið það smáatriði sem býður upp á fagmennsku á vefsíðu þinni til að hlaða niður öllum gerðum skráa.

Sveima hnappinn

Sveima hnappinn

Þessi hnappur bíður eftir þér yfirgefa músarbendilinn hér að ofan svo þú getir séð framúrskarandi fjör sem það býr til.

Hávaðahnappur

Hávaðahnappur

Annar sveima hnappur sem stendur upp úr rafmögnuð fjör sem á sér stað þegar sveima er yfir bendlinum.

Sveimaáhrif

Sveimaáhrif

Annað áhugavert sveimaáhrif í CSS sem stendur upp úr fyrir það hratt og lipurt fjör sem gefur góða skynjun.

Stílhrein sveimaáhrif

Sveima stíl

Einn hnappur sveima með frábærum stíl í fjörum fyrir síður með klassískum blæ.

Fíngerð áhrif

Fíngerð áhrif

Un einföld og forvitnileg áhrif sem eykur stærð CSS hnappsins með smá HTML.

Röndhnappur

Röndhnappur

Rönd er þekkt fyrir frábært starf við hönnun HÍ vefsíðu þinnar, þessi Stripe hnappur er innblásinn svo að þú getir farið með hann á vefsíðuna þína.

Þrjú CSS hnappáhrif

Þrjú áhrif

Þrjú CSS áhrif í fjörinu fyrir hnappinn og að við getum talið frábæran stíl.

Eins og Twitter hnappur

Eins og Twitter hnappur

Hnappur af like fyrir Twitter með glitrandi og kraftmiklu fjöri. Fullkomið fyrir þessa samfélagsmiðjudaga.

Eins og fjörhnappur

Eins og fjörhnappur

Hér verða hjörtu þeir sem hoppa af gleði þegar ýtt er á like hnappinn.

Splat like hnappur

splat

Annar mjög forvitnilegt fjör með miklum áhrifum fyrir eins hnapp fyrir samfélagsnet.

Spila hnappinn

Æxlun

Spilunarhnappur sem byrjar hoppa, líka af gleði, þegar ýtt er á.

Spilun CSS hnappur

CSS spilun

Hreyfimynd mun eyða ummál í kringum táknið Spilun á þessum CSS hnappi.

Pause / play hnappur

Spilun hlé

Bara hnappur hlé / spilaðu með lágmarks snertingu Í hönnuninni.

Retro einfaldur hnappur

Retro

Eins og ef við værum að þrýsta á hnappa á leikstýringu úr leikjatölvu eins og XboX.

Regnbogahnappur

Regnbogi

Hnappur með a regnboga fjör sem endurskapar tilkynningarnar sem koma til Galaxy S8.

Félagslegur hnappur

Social

Skúffa sem opnast með vinsæl tákn samfélagsmiðla með því að skilja músarbendilinn eftir á honum.

Fljótandi fjör

Fljótandi fjör

Hnappur með a gæða fjör það er hrundið af stað þegar við smellum á það.

3D félagsleg tákn

3D félagsleg tákn

Un athygli sem vekur athygli og það gerist þegar við látum bendilinn hvíla.

Félagslegir hnappar

Félagslegir hnappar

Þessir félagslegir hnappar nota fjör Það breytir litnum að ofan til að aðgreina sig frá restinni.

Kubískir félagslegir hnappar

Kubískir félagslegir hnappar

Þessir hnappar eru staðsett í teningi það hreyfist fullkomlega þegar við skiljum bendilinn eftir.

Deila hnappar

Deila hnappar

Un hlutahnappur aðgreindar með óendanlegu hringrás fjör.

Samnýtingarhnappur samfélagsmiðla í SVG

Deila hnappar svg

Ýttu bara á deilihnappinn og þú munt finna guðleg áhrif sem kemur fyrir í þessum samfélagsmiðlahnappi.

Feginn hlutdeildarhnappur

Deildu fínt

Með öðrum fjör «Fínt», þessi hnappur er mjög sláandi fyrir áhrifin sem hann framleiðir.

hlut

hlut

þetta hnappur er skipt í fjóra mismunandi svo að þú getir valið samfélagsnetið þar sem þú birtir beint deilt efni.

Stjörnugjöf hnappur

Stjörnugjöf hnappur

Hnappur sveima sem safnar stigum sem þú ætlar að gefa þegar þú skilur eftir bendilinn.

SVG stigahnappur

Skora SVG hnappinn

Annar sveima hnappur fyrir skora með einkunn vara eða hvað sem er.

Hleðsluhnappur

Hleðsluhnappur

Með því að ýta á hlaða upp hnappinn mun hefja niðurhalsferlið eða hvað sem hentar vefsíðunni þinni best.

Samþykkja hnappinn

samþykkja hnappinn

Ýttu á það og eyðublað verður samþykkt eða einhverjar aðrar aðgerðir sem þarf samþykki notanda vefsíðu okkar.

Strjúktu hnappinn

Strjúka

Hollur fyrir farsíma, það verður að ýta á þennan hnapp til að taka hann til hliðar með því látbragði sem er svona dæmigert í snjallsímum.

Opnaðu látbragð

Opnaðu látbragð

Un hliðarbending með fingri eða bendi og við munum opna flugstöðina sjálfa. Annar tilvalinn hnappur fyrir farsíma.


Innihald greinarinnar fylgir meginreglum okkar um siðareglur ritstjórnar. Til að tilkynna um villu smelltu hér.

2 athugasemdir, láttu þitt eftir

Skildu eftir athugasemd þína

Netfangið þitt verður ekki birt. Nauðsynlegir reitir eru merktir með *

*

*

  1. Ábyrgðarmaður gagna: Miguel Ángel Gatón
  2. Tilgangur gagnanna: Control SPAM, umsögn stjórnun.
  3. Lögmæti: Samþykki þitt
  4. Samskipti gagna: Gögnunum verður ekki miðlað til þriðja aðila nema með lagalegri skyldu.
  5. Gagnageymsla: Gagnagrunnur sem Occentus Networks (ESB) hýsir
  6. Réttindi: Hvenær sem er getur þú takmarkað, endurheimt og eytt upplýsingum þínum.

  1.   Nelson sagði

    Frábært framlag vinur, takk fyrir

  2.   benito carlos sagði

    síðan þín er svolítið þung, ef þú veist mikið um forritun og þessa hluti ættirðu að fínstilla hana og ekki nota wordpress xc