How to Retrieve Video Viewing Time Using jQuery

Monitoring the duration of an html5 video can be tricky. When playing a video and pausing at 2 seconds, the console may record a usage duration of 2 seconds. However, if you resume the video at 2 seconds and play for an additional 3 seconds, the total usage duration is calculated as 5 seconds instead of 3 seconds.


time: function(video) {
  var seconds = 0;
  video = $("#" + video.id()).find("video").get(0);
  if (video.played.length > 0) {
    seconds += video.played.end(0) - video.played.start(0);         
  }
  return Math.round(seconds);
}

The goal is to obtain the latest start time upon resuming and subtract it from the end time of the video played. However, the issue arises where the start value always returns as zero, failing to capture the new start time upon resuming.

Any suggestions or assistance on this matter would be greatly appreciated.

Answer №1

One way to gather data is by recording the duration between when the user initiates playback and subsequently halts or suspends it.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using .htaccess file to optimize SEO crawling for single page applications that do not use hashbangs

When using a page with pushState enabled, the typical method of redirecting SEO bots involves utilizing the escaped_fragment convention. More information on this can be found here. This convention operates under the assumption that a hashbang prefix (#!) ...

Ways to ensure that two divs have equal heights based on whichever one has the greater height using CSS

I need help with adjusting the heights of two divs inside a container div using CSS. Specifically, I want the height of the img_box div to match the height of the content_con div based on their actual content. For example, if the content_con div contains t ...

Tips on aligning text link to the right within li using CSS

I am looking to adjust the position of a text link that is currently aligned to the left inside an li element, by moving it slightly to the right. Is there a way to achieve this effect without changing the overall layout? Page link: CSS: #secondnav li ...

unable to successfully execute jQuery popup close functionality

I have a button on my mobile site that I want to function as follows: Upon clicking the button, a popup should appear with text and an OK button. When the OK button is clicked, the popup should disappear without affecting the page. My code for this functi ...

hide bootstrap confirmation when clicking off of it

I'm facing an issue with the bootstrap confirmation plugin. I want to close all confirmations when the user clicks outside of the confirmation pop-up. However, the current implementation is causing the confirmation to close everytime there is a click ...

Steps to swap out an array string with a user-entered string

Greetings, I am a newcomer to StackOverflow and seeking assistance with a code snippet that replaces every underscore in a given string. public class MainActivity extends AppCompatActivity { private String result=""; private String textresult = "The red f ...

What is the best way to align image at the center of a jumbotron?

Exploring the world of bootstrap has been a fun journey, but I've hit a roadblock with the jumbotron element. No matter what I try, I can't seem to successfully add and center an image within the jumbotron using normal CSS3 techniques. Despite my ...

Tips for creating animations with JavaScript on a webpage

I created a navigation bar for practice and attempted to show or hide its content only when its title is clicked. I successfully toggled a hidden class on and off, but I also wanted it to transition and slide down instead of just appearing suddenly. Unfort ...

Why is the CSS functioning on JSFiddle but not on my local machine or remote website?

One of the issues I am facing with my website is related to the css menu. The dropdown items are visible, but when attempting to click on them, the dropdown closes immediately. Interestingly, the navigation functions properly on JSFiddle here. However, t ...

How can I effectively recycle styles within Ionic applications?

I have included a few style rules in the global.scss file that I intend to utilize across multiple pages. Here is an example: .primary-blue-color { --ion-background-color: #005bbb; } .primary-red-color { --ion-background-color: red; } My approach is t ...

Using jQuery to extract information from a serialized array in ColdFusion

Recently, I made an update to a coldfusion function that now returns a string with additional serialized array data at the end. Despite realizing this may not be the most efficient method, I am currently constrained by this approach. var str = '1^Suc ...

Flot Graphs: A unique dual-axis line chart with the ability to stack data on one axis

Is it possible to utilize the FLOT Javascript library for creating a chart with dual axis and three data sets? I am specifically looking to have one data set on the left axis and two on the right axis. Ideally, I want to stack the two datasets on the right ...

Determine the amount of unused vertical space within a block of text

Having applied CSS to a span element: font-height = 120px; height = 120px; line-height = 120px; The text inside the span does not completely fill the height of 120px. Is there a method to determine the offset of the text from the top and bottom boundar ...

Issue with the first-child selector

Is this supposed to work or am I losing my mind? .project.work:first-child:before { content: 'Projects'; } .project.research:first-child:before { content: 'Research'; } <div class="project work"> <p>abcdef</p> ...

An effective way to determine the size of a browser through javascript

In an effort to enhance the responsiveness of a website, I have included the following code snippet on one of my pages: document.write(screen.width+'x'+screen.height); However, I am encountering an issue where the code displays my screen resolu ...

Adjusting background position using incremental changes through JavaScript

Although I have a strong background in PHP coding, using javascript is a new venture for me so I hope this question doesn't sound naive. My objective is to create a button that, when clicked, shifts the background-position of a specified DIV object b ...

What is the best way to eliminate the excess space below my personalized badge design?

How do I eliminate the space below the badge component without using padding or margins? I suspect it may be related to line-height, but I want the badge height to perfectly match its content. Any suggestions on how to achieve this? https://i.sstatic.net/ ...

Using a loop to pass a template to a function and create a dynamic component

I am currently attempting to dynamically generate a component while looping through a list. However, I have encountered an issue where the template cannot be passed to the function for creating the component. The error message indicates that the viewCont ...

What is the best way to retrieve the directory path from a FileReader in Java

Hey there, check out these codes I have for reading the file that the user uploads: function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function(e) { $('#myImg' ...

Issue encountered with the Selenium JavaScript Chrome WebDriver

When it comes to testing an application, I always rely on using Selenium chromewebdriver. For beginners like me, the starting point was following this insightful Tutorial: https://code.google.com/p/selenium/wiki/WebDriverJs#Getting_Started After download ...