Member Avatar for Himanshu Chawla

Hello,

I am new to Jquery and task is given to me to "make a progress bar for task completion " . For example: there are 4 Sections and all those 4 section have different youtube videos . After the user clicks the section and watch the video of that particular section the progress bar should be increased to 25% completed.

I am searching for this kind of tool available on internet but i haven't got any apart from that bootstrap file upload progress bar.

Can anybody help me out and make me understand how to make it . I am new to Jquery so please give me some example or fiddle example so that i can implement after getting it through.

Thanks

  • 4 Contributors
  • 4 Replies
  • 337 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by diafol
Member Avatar for Dani

You can use jQuery to attact an event handler to a specific event, which says the code to implement when the video is watched.

You can use .click() to trigger the progress bar to move when something is clicked on (https://api.jquery.com/click/) but unfortunately I have no clue if it's possible for it to know if the YouTube video is done being watched. YouTube API I guess??

Member Avatar for Himanshu Chawla

I am working on that only .

thanks @Dani for the help . I think that will work .

thanks @happygeek for reminding me . Thanks

Member Avatar for diafol

I'll just chip in, remember to consider whether the video needs to be watched in its entirety - for that you will probably need the YT API - but I've not looked deeply into it, so can't comment on whether it has such a feature.

An example can be found here if you're scratching your head: http://stackoverflow.com/questions/7853904/how-to-detect-when-a-youtube-video-finishes-playing

Ok, that's enough of a freebie, or I'll get into trouble :)

Edited by diafol
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.