Black Flash shows briefly when .swf file is served

[wright67uk]

I am trying to find out how I can eliminate the black flash that I see when viewing blackdogDOTlondon in safari on a Mac. I have tested it in v7.2 and v8.

 

The black flash appears when the .swf file is served, and does not appear when the mp4 is served in Chrome for example.

 

I have gone through similar threads and have seen that adding poster images has solved this issue for some people and hiding the video until it has unloaded working for others.

 

I have tried these steps but still have the same issue.

Is there anything else that I could try and what steps should I take to find out what causes this rather off-putting black flash?

<script>
  var isMobile = window.matchMedia("(max-width: 760px)").matches;
  if (!isMobile) {
    var myvideo = jQuery('<video id="my_video" controls="controls" autoplay="autoplay" poster="/sites/default/files/landingstill.jpg" />').append('<source src="/sites/default/files/walking.mp4" type="video/mp4">\
    <source src="/sites/default/files/walking.mpg" type="video/mpeg">\
    <source src="/sites/default/files/walking.ogv" type="video/ogg">\
    <source src="/sites/default/files/walking.mov" type="video/mov">\
    <source src="/sites/default/files/walking.3gp" type="video/3gpp">\
    <source src="/sites/default/files/walking.webm" type="video/webm">\
    <object width="100%" height="100%" type="application/x-shockwave-flash" data="/sites/default/files/walking.swf">\
      <param name="movie" value="/sites/default/files/walking.swf" />\
      <param name="loop" value="false" />\
      <param name="width" value="100%" />\
      <param name="height" value="100%" />\
      <param name="wmode" value="opaque">\
      <param name="flashvars" value="autostart=true&controlbar=over&image=/sites/default/files/landingstill.jpg&file=/sites/default/files/walking.mp4" />\
      <img src="/sites/default/files/landingstill.jpg" alt="walking" title="Your browser does not support the video tag and flash."/>\
    </object>');
    jQuery('#videoclip').prepend(myvideo);
  } else {
    jQuery('#videoclip').css('background-image','url("/sites/default/files/landingstill.jpg")');
    jQuery('#videoclip').css('background-repeat','no-repeat');
    jQuery('#videoclip').css('background-attachment','fixed');
    jQuery('#videoclip').css('height','492px');
    jQuery('#videoclip').css('background-position','center top');
    jQuery('#videoclip').css('background-size','760px 400px');
    jQuery('#space').slideUp("slow");
    jQuery('.navbar').slideDown("slow");
  }
  jQuery(document).ready(function() {
    document.getElementById('my_video').style.visibility = "visible";
    setTimeout(function() {
      var h = jQuery(window).scrollTop();
      resize_home_page_image_divs();
      setTimeout(function() { resize_home_page_image_divs()}, 200);
      if (!isMobile && h > 100) {
        var h1 = jQuery('#space').height();
        var nh = h>h1?h-h1-100:h-50;
        jQuery('#space').hide();        
        jQuery('body').scrollTo(nh);
        jQuery('.navbar').slideDown("slow");
      } else {
        jQuery('#space').delay(4000).slideUp("slow");
        jQuery('.navbar').delay(4000).slideDown("slow");
        setTimeout(function() {
          var h = jQuery(window).scrollTop();
          jQuery('body').scrollTo(h+5).scrollTo(h);
        },4500);
      }
    },100);
    jQuery(window).on('beforeunload', function() { jQuery("video").hide(); });
  });
</script>