Expanding Flex Cards - How to Design Expanding Flex Cards using HTML CSS and jQuery

[@elonkiptoo1710]

Wauh amazing keep uploading those skills

[@CodingPlay]

I will try my best, Thank You!

[@marklnz]

Not too bad - you don't really need to go to the trouble of linking jQuery just to do add/remove an attribute though. I'd do that with vanilla JS (actually I wouldn't, I'd find a No JS way to do it). Also, not sure on some of your class naming - you don't really need to be quite so specific with some of those rules, given that this is all that's on the page. I get that if you have other ".title" elements then maybe you'd want to be more specific but that's what I mean about your naming - if you don't need those rules to apply anywhere else, just create a class that's specifically for that task, and apply a less specific rule. That's a style thing though - obviously it works fine as it is.

[@CodingPlay]

Appreciate your suggestions! Thanks for watching

[@pankajravi9146]

wonderful bro, i just used your code on my website, though i will make few changes, but thanks much . Cheers !

[@querinoland8413]

amazing, would I put an action when I click to expand I trigger a sound? with javascript?

[@jasimimran6048]

Amazing content keep it up! i just have 1 question when you apply - - bg in style how does that whole system work I'm a bit confused on that.

[@CodingPlay]

Good question! --bg is a CSS variable and I declared it in the HTML file for each "card" div and called it in the CSS file.

[@jasimimran6048]

@@CodingPlay oh okay I also noticed that you used a URL for applying a picture my question is what would I have to do if I had an image already downloaded and I had to apply those pictures on the card? P.S: Amazing content it would be even better if you provided a voice-over simultaneously.

[@CodingPlay]

@@jasimimran6048 Simply change the url("YOUR_IMAGES_PATH")

[@CodingPlay]

@@jasimimran6048 I will try my best to use my voice in the future but currently I don't have a proper recording mic and an acoustic environment.

[@xenonyoutub]

Can we use video instead of image in cards?

[@MrStelloMEllo]

Is there any tutorial how to do this on figma

[@xenonyoutub]

Nice job man

[@iamgroot4060]

Unable to add images throught your code