Solved

Safari vs. FireFox

Posted on 2013-01-31
13
367 Views
Last Modified: 2013-02-05
We have a page that works in FireFox but NOT in Safari.

http://aquascapegetyourfeetwet.com/play_vid_onlyjs.htm

In FireFox it plays; in Safari I just get a black box.

Why does it not work in Safari?
0
Comment
Question by:Richard Korts
13 Comments
 
LVL 6

Expert Comment

by:nickinthooz
Comment Utility
Safari needs quicktime to play html5 video's.  Install the latest version of quicktime and try it again.  zencdn uses html5.

If that doesn't help.  Check your .htaccess and MIME types.
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 200 total points
Comment Utility
replace :
	var myVideo = document.getElementById("video1");
	ac = "";

Open in new window

by :
	var myVideo
                var ac = "";
        window.onload = function() {
               myVideo  = document.getElementById("video1");
        }

Open in new window

0
 

Author Comment

by:Richard Korts
Comment Utility
To leakim971

Did that. Still the same.
0
 

Author Comment

by:Richard Korts
Comment Utility
To nickinthooz

We have no control over what the end user has configured. We just want this to PLAY, regardless of the browser.

I am testing on an iPad, I have NO IDEA how to equip iPad with Quick Time be it doesn't matter.
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
To leakim971

Did that. Still the same.

I don't see any change in the page
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
OK, I see you add the code now, work for me now, check attachment
Clipboard02.jpg
0
Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

 

Author Comment

by:Richard Korts
Comment Utility
To leakim971

OK, here'e the source for the upper part:

<!doctype html>
<html  lang="en">
<head>
<meta charset="utf-8">
<meta content="IE=edge,chrome=1" />

<title>Play Video</title>
<link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/c/video.js"></script>
<script language="JavaScript" type="text/javascript">
      var myVideo
        var ac = "";
        window.onload = function() {
               myVideo  = document.getElementById("video1");
        }
      function do_init() {
            document.getElementById("scode").disabled=true;
            document.getElementById("subgo").disabled=true;
            window.setTimeout("see_if_done()", 1000);
      }      
      function see_if_done() {
            var myVideo = document.getElementById("video1");
                  if (myVideo.ended) {
                        code = "THE CODE";
                        document.getElementById("scode").disabled=false;
                        document.getElementById("subgo").disabled=false;
                        alert("Enter your code of " + code + " now and click Go.");
                        
                  } else {
                        window.setTimeout("see_if_done()", 1000);
                  }
            return true;
      }
      function chk_vals() {
            if (ac != "p") {
                  if (document.fr.scode.value == "") {
                        alert("Please enter your code.");
                        return false;
                  }
                  return true;            
            } else {
                  return false;
            }      
      }
function vid_play_pause() {
      var myVideo = document.getElementById("video1");
  if (myVideo.paused) {
    myVideo.play();
  } else {
    myVideo.pause();
  }
  return true;
}
0
 

Author Comment

by:Richard Korts
Comment Utility
To To leakim971

Doesn't work on iPad.

I'll ask my partner to try on Safari on a computer.

Thanks
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
I'm on PC, I got the problem on Chrome but now it work once you add the window.onload = function() {} block
Don't forget to clear the browser cache
0
 
LVL 20

Assisted Solution

by:informaniac
informaniac earned 100 total points
Comment Utility
For me it doesn't even work in IE9 on Windows Vista, but works in Firefox.
0
 
LVL 82

Assisted Solution

by:Dave Baldwin
Dave Baldwin earned 100 total points
Comment Utility
We just want this to PLAY, regardless of the browser.

Since nothing ever plays without a player, that is just not your choice.  In theory, some browser will play HTML5 videos but as shown in one of your previous questions, you have to add adequate detail to make that happen.  You can't just put something up and think it will automagically play.
0
 
LVL 11

Assisted Solution

by:mcnute
mcnute earned 100 total points
Comment Utility
your video work on my safari on mac osx Lion. Although it takes a little longer than in chrome to start.

video js may be your choice. It overcomes all html5 video differences through browsers. For older IE versions there is a flash player fallback integrated.

To make your video play in all browsers you'll need them converted in at least three formats:
flv, ogg and mp4 for safari.

Your mp4 files must have the mov atom meta data file in the beginning of the file, otherwise the browser will first download the whole video and then actually play the video.
More about that here:
http://www.adobe.com/devnet/video/articles/mp4_movie_atom.html
http://drupal.org/node/1565532
0
 

Author Closing Comment

by:Richard Korts
Comment Utility
The problem is NOT solved. Points awarded based on effort.

We used a custom developed solution in Jquery.
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

I had to do a bit of research to find the answer to this question so I thought I'd share my results.  Due to our outdated mainframe systems, we need to downgrade IE9 to IE8 in order to stay compatible.  We also needed to downgrade Java.  In order to…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
This Micro Tutorial will demonstrate how nuggets on the Web are formatted by using Chrome Developer Tools. These tools would not only view the site's CSS but it can also modify it and save the CSS to use on your own site.

772 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now