SamC Posted June 3, 2017 Posted June 3, 2017 I'm still learning vanilla JS at the moment but trying out a bit of jQuery here and there. This has me stumped though: I don't know how to target only the element that's clicked on. Of course, when clicking now, both overlays pop up because a class 'show' is added to any element with class 'card-reveal' i.e. to both of them. Probably pretty simple for someone with more experience but I'm finding this awkward to search for a solution online. Any help is appreciated, thanks.
Zeka Posted June 3, 2017 Posted June 3, 2017 $(this).closest(".card-footer").siblings(".card-reveal").toggleClass("show"); 2
SamC Posted June 3, 2017 Author Posted June 3, 2017 Thanks @Zeka Ok, so the reveal shows, but the hide button doesn't seem to toggle the class now. Think I need to dig in at what closest & siblings are doing here. I updated the pen to show what I'm talking about.
Zeka Posted June 3, 2017 Posted June 3, 2017 Quote hide button doesn't seem to toggle the class now Yes, that normal behavior in this case, because ($this) refers to the object (button, anchor) that was clicked. There is working example pen 1
SamC Posted June 3, 2017 Author Posted June 3, 2017 2 minutes ago, Zeka said: Yes, that normal behavior in this case, because ($this) refers to the object (button, anchor) that was clicked. There is working example pen Ah, I see, thanks for the help
Pixrael Posted June 3, 2017 Posted June 3, 2017 This should be the simple way, and you can modify anything else inside your card while Show class is on Codepen 1
SamC Posted June 3, 2017 Author Posted June 3, 2017 1 hour ago, Pixrael said: This should be the simple way, and you can modify anything else inside your card while Show class is on Codepen Well played sir! 1
lecrackffm Posted June 10, 2017 Posted June 10, 2017 Here are two resources i found quite useful leaving jQuery behind.. https://plainjs.com/ http://youmightnotneedjquery.com/ Have a nice weekend. 1
SamC Posted June 10, 2017 Author Posted June 10, 2017 28 minutes ago, lecrackffm said: Here are two resources i found quite useful leaving jQuery behind.. https://plainjs.com/ http://youmightnotneedjquery.com/ Have a nice weekend. Nice, thanks @lecrackffm I'm still learning vanilla JS and think these will be great for me. It's been a LONG journey for me to get into it but I think I'm finally making headway, getting deeper into objects, closures etc. moving onto prototype next. I think it's fair to say I'm as good as the amount of effort I've put in. Doing about an hour a day now, really need my JS to be as good as my CSS/HTML to be a much better all rounder. PHP is something I'm not brilliant with either but I can live with that thanks to the PW API
lecrackffm Posted June 11, 2017 Posted June 11, 2017 @SamC I would consider myself a beginner in JS as well. There is always more to learn. Here is another resource, which helped me a lot to understand the core concepts of JS. Disclaimer: These are only the first 3.5 Hours. The full video is only available through a paid online Service. 2
SamC Posted June 12, 2017 Author Posted June 12, 2017 13 hours ago, lecrackffm said: Disclaimer: These are only the first 3.5 Hours. The full video is only available through a paid online Service. Thanks @lecrackffm I bought this course a while ago on a deal for about £10, only about halfway through but so far it's been excellent Working through another one at the moment but definitely going back to the weird parts afterwards!
Pixrael Posted May 8, 2020 Posted May 8, 2020 https://timkadlec.com/remembers/2020-04-21-the-cost-of-javascript-frameworks/
Recommended Posts