SamC Posted June 3, 2017 Share 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. Link to comment Share on other sites More sharing options...
Zeka Posted June 3, 2017 Share Posted June 3, 2017 $(this).closest(".card-footer").siblings(".card-reveal").toggleClass("show"); 2 Link to comment Share on other sites More sharing options...
SamC Posted June 3, 2017 Author Share 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. Link to comment Share on other sites More sharing options...
Zeka Posted June 3, 2017 Share Posted June 3, 2017 Quote hide button doesn't seem to toggle the class now Expand Yes, that normal behavior in this case, because ($this) refers to the object (button, anchor) that was clicked. There is working example pen 1 Link to comment Share on other sites More sharing options...
SamC Posted June 3, 2017 Author Share Posted June 3, 2017 On 6/3/2017 at 11:51 AM, 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 Expand Ah, I see, thanks for the help Link to comment Share on other sites More sharing options...
Pixrael Posted June 3, 2017 Share 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 Link to comment Share on other sites More sharing options...
Zeka Posted June 3, 2017 Share Posted June 3, 2017 @Pixrael nice done! 2 Link to comment Share on other sites More sharing options...
SamC Posted June 3, 2017 Author Share Posted June 3, 2017 On 6/3/2017 at 4:54 PM, Pixrael said: This should be the simple way, and you can modify anything else inside your card while Show class is on Codepen Expand Well played sir! 1 Link to comment Share on other sites More sharing options...
lecrackffm Posted June 10, 2017 Share 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 Link to comment Share on other sites More sharing options...
SamC Posted June 10, 2017 Author Share Posted June 10, 2017 On 6/10/2017 at 2:48 PM, lecrackffm said: Here are two resources i found quite useful leaving jQuery behind.. https://plainjs.com/ http://youmightnotneedjquery.com/ Have a nice weekend. Expand 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 Link to comment Share on other sites More sharing options...
lecrackffm Posted June 11, 2017 Share 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 Link to comment Share on other sites More sharing options...
SamC Posted June 12, 2017 Author Share Posted June 12, 2017 On 6/11/2017 at 5:44 PM, lecrackffm said: Disclaimer: These are only the first 3.5 Hours. The full video is only available through a paid online Service. Expand 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! Link to comment Share on other sites More sharing options...
Pixrael Posted May 8, 2020 Share Posted May 8, 2020 https://timkadlec.com/remembers/2020-04-21-the-cost-of-javascript-frameworks/ Link to comment Share on other sites More sharing options...
Recommended Posts