JavaScript for WordPress Forums Vanilla JavaScript EventListener Project

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #14961
    Jason
    Participant

    I am going through section 1.4 and just finished up the EventListener sections and thought I would take Zac’s advice and try building out accordion style tabs. I have it sort of working but for some reason I have to click on the tab twice before it opens the first time. Not sure what is going on. Any help is appreciated. See the jsbin.

    #14979
    Zac Gordon
    Keymaster

    Hey Jason!

    My first suggestion would be to make the tab titles actual links. They can have a URL of #tab-x and then the related content area would have related IDs so the links work even if JS isn’t applied (just make sure you are doing the initial hiding of the content via JS so if there is no JS you can still access the content).

    You did some good thinking with your accordion code, but you might find tweaking the html like this make it easier. It may also solve your double click issue just with the titles being links with preventDefault applied.

    Let me know how that goes..

    #15007
    Jason
    Participant

    Thanks, Zac! That totally makes sense, I kind of rushed through the HTML part just to get the page built so I could start working on the JS. I updated the JSBin but still getting the double click issue.

    #15111
    Jason
    Participant

    Ok, after a good night sleep, I decided to open this back up and mess around with it. I tried changing the last parameter in the eventListener to true and that solved the issue. I’m not sure why yet (I haven’t made it that far in the course) but look forward to finding out 😉

    #15155
    Zac Gordon
    Keymaster

    Aw yes, event propagation 🙂 makes sense, you’ll enjoy that video. Very important topic not a ton of folks understand. Sorry I missed that!!!

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.