Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!
  • Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • You can also use markdown to share your code. When using markdown your code will be automatically converted to BBCode. For help with markdown check out the markdown guide.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

What is the reason for the sound disappearing in my video player?

Your code seems to be an attempt to synchronize two video players—one for video and one for audio. However, there are a few potential issues that might be causing the sound to disappear. Here are a few things to check and modify:
  1. Ensure Video.js is loaded for both players:Make sure that the Video.js library is loaded for both video and audio players. You have already included it for the video player, but you need to add it for the audio player as well. Update your code to include the following line in the <head> section:
    HTML:
    <script src="https://vjs.zencdn.net/7.15.4/video.js"></script>
  2. Remove the display: none style for the audio player:You've set the style for the audio player to display: none, which means it will not be visible on the page. While this might not directly affect the sound, it's unnecessary and may lead to unexpected behavior. Remove the following style from your CSS:
    CSS:
    #my-video-audio {
    display: none;
    }
  3. Check for errors in the browser console:Open your browser's developer tools (usually by pressing F12), go to the "Console" tab, and check if there are any error messages. Fixing any errors reported in the console might resolve the issue.
  4. Ensure CORS headers are set correctly:Make sure that the server serving your video and audio files includes the appropriate CORS headers to allow cross-origin requests.
  5. Debugging with alerts or console.log:You can add some alert or console.log statements in your JavaScript code to debug and check the flow of execution. For example, add console.log statements to log the current time of the video and audio players during playback.
    JavaScript:
    console.log('Video Current Time:', videoPlayer.currentTime());
    console.log('Audio Current Time:', audioPlayer.currentTime());
    Use these statements to check if the synchronization logic is working as expected.
  6. Test in different browsers: Sometimes, issues might be browser-specific. Test your code in different browsers to see if the problem persists.
Make these adjustments and carefully test your code. If the issue persists, you may need to further investigate by checking the network requests, server responses, and debugging the synchronization logic.
 

New Threads

Buy us a coffee!

Back
Top Bottom