Can't see the animation after updating the file and code

Hi there,

I’ve done a search and can’t find my problem. I’ve created an animation and exported it. I’ve uploaded the HTML file and Hypersources folder to my WPcontent/uploads/2016/08 folder as instructed.

When I past the code into my web editor the div is there but displays nothing, it also asks for a username and password.

Here’s the code I’ve pasted:

<div id="lotteryanimation5_hype_container" style="margin:2px;position:relative;width:760px;overflow:hidden;" aria-live="polite"> <script type="text/javascript" charset="utf-8" src="ftp://ftp.ashgatelottery.org.uk/wp-content/uploads/2016/08/Lottery%20animation%205/Lottery%20animation%205.hyperesources"></script> </div>

Any ideas welcome.

Here’s the site that I’m working on: http://ashgatelottery.org.uk/

Is it possible this happens because of Wordpress? What happens when you type your Wordpress username/password in? I’m not enough of a programming guru to diagnose much beyond here, but I’m wondering if it loads when you enter that info - it might indicate you need to change a setting elsewhere in Wordpress?

Cheers for the reply Dave, I enter the password and still no display so I’m fairly sure I’ve messed up the code somewhere, I’ve been away from web design for 6 years and seem to have forgotten most of it!

Hi Phil!

I’m not a Wordpress guy - but in my readings on this Forum about problems with Wordpress that have the “nothing shows” issue, often the cause is the “height” is not set for the container. I noticed in the code for your “div” there was not a height set.

This following thread offers many insights. The post quoted here (@daniel) was marked as a solution. Perhaps the info in this thread will help You out:

Thanks for that Jim, I’ve tried the height thing and still no good. The log in problem was the ftp reference on the start of the src code. Still didn’y display so I’ve just put an animated gif in instead for now. Not great but it’ll do until I figure out how to use HTML5

Sorry I should have mentioned when I first opened the link you supplied I got an alert by me system that the page wanted to connect to an FTP. I did think it may be why you would get a login prompt. But once I denied it I did not get the prompt so was not able to test that thought further…

Hi Mark, yes that was a problem. In the the src link it was pointing towards ftp whicjh promted the log in. I replaced that with http and the log in was sorted but I still had no animation displaying.

It probably because you are pointing at the resource folder, which is a directory not a file.

point at the src at .js file in the resource folder you exported.

http://ashgatelottery.org.uk/wp-content/uploads/2016/08/Lottery%20animation%205/Lottery%20animation%205.hyperesources/lotteryanimation5_hype_generated_script.js


<div id="lotteryanimation5_hype_container" style="margin:2px;position:relative;width:760px;overflow:hidden;" aria-live="polite">
<script type="text/javascript" charset="utf-8" src="http://ashgatelottery.org.uk/wp-content/uploads/2016/08/Lottery%20animation%205/Lottery%20animation%205.hyperesources/lotteryanimation5_hype_generated_script.js"></script>
</div>
1 Like

Excellent! that’s working now Mark. Many thanks :slight_smile:

1 Like

Ok, after having resolved this issue, annoyingly the animation has disappeared again after I updated the file to try and get it to repeat play.

Here is the new code I’ve inputed:

<div id="lotteryanimation1_hype_container" style="margin:auto;position:relative;width:760px;height:380px;overflow:hidden;float: right" aria-live="polite"> <script type="text/javascript" charset="utf-8" src="http://ashgatelottery.org.uk//public_html/wp-content/uploads/2016/09/Lottery%20animation%201.hyperesources/lotteryanimation1_hype_generated_script.js"></script> </div>indent preformatted text by 4 spaces

Just fixed this, I left in the public_html part. Once removed. the animation was present and correct :slight_smile: