Opening intro video

Site URL: https://henryoboyleillustrations.squarespace.com/

Hello,

so what I’m trying to do is create an opening intro video or maybe a gif. I want the video to show at the very beginning when they first enter the site. Then just fade into the home page. I only want it to show once as well, just at the beginning. Is this possible?

many thanks

henry

Try code in this question. 

55 minutes ago, tuanphan said:

Try code in this question. 

 

Hi Thanks for the reply, this seems to be the like the thing im trying to do. How do I put a video instead of a gif, its saved on my hard drive. does it need to be on the internet first?

Thanks

1 hour ago, tuanphan said:

Try code in this question. 

 

If i put the same this like this.

But just reference my video, will that work?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div class="logoload"></div>
<style>
.logoload {
  /* SET BACKGROUND COLOR */
  background-color: #fff;
  /* SET BACKGROUND SIZE */
  background-size: 90px;
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("file:///Users/henryoboyle/Desktop/intro/intro.html");
}
</style>
<script type="text/javascript">
$(window).load(function() {
    $(".logoload").delay(500).fadeOut("slow");
})
</script>

Hello @tuanphan 

I used the code above but I encountered 2 issues.

1) I'm unable to play my full gif before the website appears. 2) Sometimes it shows the last frame of my gif, instead of playing the full gif. 

Any help will be greatly appreciated!