I'm not sure if this is a code related problem or if it has somehting to do with making it work on my azurewebsite server.
I have a simple gif animation which should show on pageload, I placed the following html as the top body element in the layout file of my mvc 5 project (so that it works on every page I load).
<div id="cover"></div>
and this jquery script in the bottom of the layout file
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.confirm.js"></script>
<script type="text/javascript">
// gif page loader
$(window).load(function () {
$('#cover').fadeOut(500);
});
</script>
and I have the following css in a less file I added to bundleconfig
#cover {
background: url("/Images/LayoutImages/loading3.gif") no-repeat scroll center center #FFF;
position: fixed;
text-align: left;
height: 100%;
width: 100%;
z-index: 999;
background-color: white;
}
When i run this locally through visual studio, the gif shows correctly every time I change a page and keeps loading for 400ms or if the page hasn't finished loading yet. Which is exactly what I want.
But after downloading my publish profile from azure and publishing my project through visual studio, the gif no longer appears on the uploaded project? Pages just load without it? I checked and the gif is in the correct folder on the website.
Can anyone explain to me why this could be?