HomeОбразованиеRelated VideosMore From: DarkCode

Social media buttons with amazing animation on hover using html & css

4281 ratings | 78942 views
◘ Join our group in facebook : https://www.facebook.com/groups/704904666369941 ◘ Like our page : https://www.facebook.com/darkcode0/ ◘ Paypal donation link : https://paypal.me/YBenlachheb ◘ Become my patron : https://www.patreon.com/DarkCode ◘ Download Files From Here : https://goo.gl/ad75rR ◘ Music Name : Diamond Eyes - Flutter [NCS Release] ◘ Music Link : https://www.youtube.com/watch?v=lEHM9HZf0IA
Html code for embedding videos on your blog
Text Comments (154)
Jairus Matthias (6 hours ago)
very intelligent great job
PROF JEB (1 day ago)
Could you make that work when offline?.. I mean if you don't have connection it's show the icon
DarkCode (19 hours ago)
You should download the offline version from fontawesome
Benjamin Leson (1 day ago)
Nice video, but i have a problem: i use sublime texte 3 and the "::before" doesn't work, i don't know why, if can someone help me :D thx !!
DarkCode (19 hours ago)
It work bro just give me your code to see where is the problem
Nicolos Smith (2 days ago)
very useful and informative
Only 4 You (4 days ago)
Thank you bro
Hax Guru (6 days ago)
Heyy please tell me that why did you use LINE HEIGHT??
Franco Alvarez (9 days ago)
Nice
Akaid bd (9 days ago)
greet bozz
DJ Janovich (13 days ago)
i cant see the icons, they are not there in my html
DJ Janovich (13 days ago)
SUPER NICE ViDEO!
Kallavi Kumbur (19 days ago)
Which IDE dou you use ?
YOUSSEF GAMER (26 days ago)
nice
CYBER tube (1 month ago)
Link now working!
Leandro Figueiredo (1 month ago)
Hi. How can i put this on a wordpress website? Can you help me?
0x0r00t (1 month ago)
thx
Maxare maxaradze (1 month ago)
How to apply live Preview?
Maxare maxaradze (1 month ago)
+DarkCode thanks
DarkCode (1 month ago)
install atom-html-preview
Dunia Bahasa (1 month ago)
Would you tell me how to use it for blog , please ?
Onur Tuğrul (1 month ago)
Awesome
Vigghen 07 (1 month ago)
when you added the scale 1.3 effect to the animation i tried rotate 360 deg instead and i like it more than scale 1.3
Sohail Tamboli (1 month ago)
hlo bro , Very good job but at the last portion there are some errors due to source code is not working properly after when i added 45deg radious !! plzzzz hlp me as soon as possible otherwise mail me [email protected]
uma rameshkumar (1 month ago)
Can i know the purpose of transform and keyframe in the video ?
your JD (1 month ago)
How can we get the code because it is not properly visible in the video
DarkCode (1 month ago)
+your JD welcome
your JD (1 month ago)
+DarkCode oh yes.got it thanks
DarkCode (1 month ago)
look in description bro
Leandro Figueiredo (2 months ago)
How to add this on wordpress??
The One (2 months ago)
This is very helpful thanks
DelaFarta (2 months ago)
Thank you man, it help a lot beginners !
Sahil Khalifa (2 months ago)
*? HOW CAN I ADD THIS IN MY BLOG PAGE PLEASE HELP*
Zvala (2 months ago)
Y'know what? I'll do it for ypu. Of course, if you're willing to pay me ;)
Sahil Khalifa (2 months ago)
+Zvala how
Zvala (2 months ago)
Learn to code it....
Daniel Burnside (2 months ago)
That looks super sweet!
Pak TechTube (2 months ago)
I learned From Dark Code and now I can Design also.. I uploaded some Social Icons with code you guys might like. Thank you So Much Dark Code
Nova Ariana (2 months ago)
Would you like to tell me the aplication taht uses ?
Nova Ariana (2 months ago)
+DarkCode thank you very much sir
DarkCode (2 months ago)
atom
Hydra TGM (2 months ago)
I'm new to coding, may i know what kind of note are u using in this video?
ZerefGG (2 months ago)
awesome
Md. kamrujjaman mridha (2 months ago)
thanks brother and upload more with download files
Vasantha Palaniappan (2 months ago)
like font awesome, Is there any other cool things?
Gerald Xavier (2 months ago)
Thanks Brother
LL Creations (3 months ago)
Superb
MD ASHIOUZZAMAN (3 months ago)
cool, man...keep it up
Tusher Imran (3 months ago)
Really,,, Awesome...Never Give up ✔
HEDTeching BD (3 months ago)
print ("Yeh! Good job dude")
doxu' (2 months ago)
Good... Perl programming but easy command
HEDTeching BD (2 months ago)
+DarkCode hehheheheh
DarkCode (2 months ago)
lol
theu (3 months ago)
What text editor did you use?
김동규 (3 months ago)
That's an atom
Loghin Constantin (3 months ago)
Can i use?
DarkCode (2 months ago)
go head
Jason Born (3 months ago)
what software do u use?
DarkCode (2 months ago)
atom
hala alabdulkarim (3 months ago)
that is so amazing !!! but can someone tell me hot to link these icons to an actual page that leads to a real account. i've a project i really need help,thanx
DarkCode (3 months ago)
go to html code you will find <a href="# ......> change the # with your links
Luis M (3 months ago)
Excellent video tutorial! Thanks! :D
yaykaboom (3 months ago)
the thing about animations is that its only useful in desktop. Unfortunately 80% of the world moved to mobile already.
It's_adi007 PUBG (3 months ago)
How to merge both the files or code
Lion Stunts (3 months ago)
Great
Manoj Dewangan (3 months ago)
You are awesome bro!!! I really like your all videos!
Daniel Astillero (3 months ago)
Jesus man CSS doesn't make sense at all but it's so powerful
mohamed rifkaans (3 months ago)
superb... i like it
Yohandy Chiawanda (3 months ago)
This is nice! Thank you for sharing!
Radan Mitasik (3 months ago)
Awesome is this possible in vanilla javascript or javascript at all ? Maybe jquery idk..
Forzee Rain (3 months ago)
Cool looks! You are a great fellow.
Joshua Delechos (3 months ago)
How to set that preview section? To see every alterations of code it will be updated
DarkCode (3 months ago)
install atom-html-preview
844mberer (3 months ago)
looks great..thanks.
chєmíѕtrч World (3 months ago)
Name of text editor pls
DarkCode (3 months ago)
atom
Görkem (3 months ago)
Really good job
MandM's (3 months ago)
You got skills bro
amruta chavan (3 months ago)
Explain code also
HighTaged Productions (3 months ago)
read it lol
Rain Liu (3 months ago)
great video, annoying bgm
Arjun Kapur (3 months ago)
It's nice
Huqiao Shan (3 months ago)
I love the music
Mrinmoy Ghosh (3 months ago)
You are awesome
Lee Li (3 months ago)
Wow that looks amazing! Thank you darkcode!
DarkCode (3 months ago)
Welcome
Sowbaghya Vasudaven (3 months ago)
Haii u r using which platform its my big doubt.. Pls tell me
Sowbaghya Vasudaven (3 months ago)
and also pls tell me the installing process
Sowbaghya Vasudaven (3 months ago)
+DarkCode thank u .. if u want sent the link
DarkCode (3 months ago)
atom
Sujan Dev Tips (3 months ago)
great job....something new learned today ... thanks for your efforts.
Fernando Guerreiro (3 months ago)
Great!
Peter Kulik (3 months ago)
Your videos are awesome!
DarkCode (3 months ago)
thank you
WeismanK Corps (3 months ago)
i need help, why script css animation keyframes is not work?
DarkCode (3 months ago)
and what is your browser ?
DarkCode (3 months ago)
send me your code
WeismanK Corps (3 months ago)
please help me 😂
Mounika Gedi (3 months ago)
Just now a subscriber from me..u deserve itttt!!!!!!!!!!!
BioCode (3 months ago)
18K SUBS 💕💕💕
ahmed agk (3 months ago)
Great one, man.
Lucas Sousa htpp (3 months ago)
Amazing
Tuấn Lê (3 months ago)
how can you calculate the absolute position in animation :v it's so complicated
DarkCode (3 months ago)
Appreciation ♥
marouan jedidi (3 months ago)
hi, great job ! how can i make them responsive ? like if i click on the button , it will direct me to facebook for expemple thank you :D
Mj Repol (3 months ago)
Can u make the background gradient
Gmos (4 months ago)
i have propleme :(
DarkCode (4 months ago)
what is your problem ?
Baldeep Singh (4 months ago)
But, but Google Plus died, didn't it? 😁
DarkCode (4 months ago)
no problem xD
Irwan Kurniawan (4 months ago)
thankyou broo
Mahir Faisal Arian (4 months ago)
Dude I just loved the video. I pray for your great future.ThankYou.👍
Young Indian motive (4 months ago)
Hay there please create a video on how to customize blogger comment section i mean change and create like WordPress please tell me o hope you
Gourav MN Squad (4 months ago)
Which software you are using??
DarkCode (4 months ago)
atom
OT Center (4 months ago)
hey bro... can we use svg graphics instead of these link icons?
OT Center (4 months ago)
+DarkCode thanks... i've subscribed.. and will tell my whole Sem. class about your channel...
DarkCode (4 months ago)
yes
Jack Planet (4 months ago)
Can you make a *Scroll To Top Button* with animation?
DarkCode (4 months ago)
yup i will
Manish kannoujiya (4 months ago)
super
A. O'Michael (4 months ago)
Genius!
DarkCode (4 months ago)
thank you ♥
A Star (4 months ago)
Wowww...
Akash kumar (4 months ago)
You are amazing bro
Open Tech (4 months ago)
I think adding subtitle in your video or youtube will help the viewers 🙏Great tutorials
Lion Stunts (1 month ago)
Yes you are right dude
Jonathan Wade (4 months ago)
Great video!
Android studio, make something by it
ARUN RAJ KUMAR D (4 months ago)
Awesome 💪💪💪
Artemus Channel (4 months ago)
Amazing! Thank you! (P.S. Hello from Ukraine!)
Knowing (4 months ago)
I benefit from you so much thanks to this explanation
UJEI JEBONG (4 months ago)
Thank you Darkcode ....💞💞💞💞
StevenPss (4 months ago)
Beautiful
Great
NERO (4 months ago)
these bckground musics play some shits it is better if its quiet to be focused
Acácio Silva (4 months ago)
Sensacional
avi12 (4 months ago)
Please, before uploading, play the video on your computer and ensure that the background music is lower than your voice, or if your voice is too low - boost its dBs Because I can barely hear you in this video
Dagogo Uranta (8 days ago)
I'm gonna go off-script here and ask , whats the song @Darkcode ?
NosFreeQc (13 days ago)
He's talking in the video ?
HEDTeching BD (3 months ago)
+avi12 you can make a whole video with this comment may be
avi12 (4 months ago)
Do you edit the video using Camtasia Studio? If so, try stepping up towards Adobe Premiere Pro If you can't afford the high performance that the software requires, Sony Vegas Pro is also a great, popular option Because the mentioned softwares will let you compose (Premiere Pro) / render (Vegas Pro) your raw video with your edits into a single MP4 file, and then you can play this video to see if it's good enough to be on YouTube, or there's a room for improvement - visual or audio
DarkCode (4 months ago)
yes i see this problem after uploading the video so i am sorry
OMAR ALI (4 months ago)
Thankkkkkk you
Ahmed Isiaq Deduice (4 months ago)
Cute! Where's the simplest way to start learning coding - HTML and CSS?
Ash Taylor (24 days ago)
I recommend SoloLearn.
Ahmed Isiaq Deduice (4 months ago)
+Open Tech, thanks. I'm looking into this certainly 👍🏽
Ahmed Isiaq Deduice (4 months ago)
+avi12, thanks for this wonderful response. Though, I'm already familiar with some CSS and HTML terms even though I mostly use WordPress Page Builders to design my sites. However, I'm planning on going deep into it as a developer. Thanks again
Álvaro José Flores (4 months ago)
You're already on the way my brother! If you ask, you find the answer ("I think, then I exist!").
Open Tech (4 months ago)
@Ahmed Isiaq Deduice as a beginner youtube videos is enough didn't need to pay and attend courses freeCodeCamp.org is one of best youtube channel(You can also visit their website) to learn html,css,js etc.🙏🙏

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.