My updated ‘PosterImage.png’ has an arrow pointing to the start button, like the attached screenshot. I am looking for someone to help me figure out why I’m not seeing my changes after republishing the project to my computer and FTPing the files to my hosting company.
https://lauralanoue.com/eLearning/HTML/OldMacDonald/HTML/
I am confused because when I inspect the element in the browser, it shows that the source file for my poster image is this path that is about 800 lines long or so. This is crazy and I have no idea why that is happening. Is it an issue with my hosting company? Or, is it something that is a bug in the trail version of Captivate?? I intend to purchase a subscription when the trial time runs out if all goes well. Thanks in advance for any ideas as to how to problem solve this.
Attachment 
Here is a screenshot of the browser in Inspect Element mode. I have no idea what is happening here. Should I try another hosting company?
Attachment 
Another screenshot of the Safari Inspect Element window. If you click the link for the image file, you will see that it is extremely long.
Attachment 
You are a Mac user, I am on Windows. There are quite a lot of issues with Safari, did you check at least once in another browser?
Yes. I am seeing the same issue in Google Chrome. I have another screenshot here to show you. It is not updating my audio file for the Llama either. I will try another hosting server later today.
Attachment 
Sorry, we live in different timezones.
Personally I never keep the original arrow play button, but include an image of a button IN the poster image, about the same size as the original button, centered vertically and horizontally. To be able to hide the original button, replace it by an png which is empty, only transparent pixels. The button can be found under HTML\Assets\HTMLimages. It is labeled ‘play_icon.png’ I keep the original button as ‘play_icon_old.png’ in case I need to get it back later.
Have no idea why the original play button doesn’t show up. Maybe you could try my workflow, and it is still active somewhere under your poster image. A static cover can normally not prevent the interactivity of a button. It is only a workaround of course?
Hello Laura, the first remark I have is that this tutorial video I had made was for responsive projects made with fluid boxes intended to be seen on mobile phones whereas it seems that your project is a normal project made for desktop. So if the delivery are PC/MAC desktops you do not need to create a splashcreen. You can also create a first slide as entrance.
However I have checked your link with Edge, Opera mini, Chrome, Mozilla and have had any problem with the loading. The loading time was correct. What I have seen is normal, I have seen the splashscreen you have created with an arrow then your drag & drop exercise (the submit button doens’t work). So if you don’t that the splashcreen be seen, just remove it. For a non responsive project you don’t need it.
At last, according to the settings of the server it can sometimes takes several minutes or hours before seeing the update you have made.
Excusez-moi pour une petite correction. AutoPlay is turned off for all screens, not only for mobile since the second version of CP2016 for HTML5 output. This means that to make the experience more pleasant for the user, you will want a poster image as well. Too bad, but the first slide cannot be used as a poster image.
For sure we cannot use the first slide as poster image, but when we make a training project for pc format only, we usually use the first slide as presentation with an illustration, a title, or a button, or a text of presentation or something else according to how we want to introduce its project. This way is often used and is possible.
You seem not to understand my answer. You told that you don’t need a poster image for a non-responsive project. I corrected that because you DO NEED it if you publish to HTML5, where Autoplay is disabled. Please do not avoid my statement, you talk about something different.
Just tested one of my published courses, which has a splash screen. Works perfectly. Can you test it on your side:
My splash screen does not play in Internet Explorer or in Edge browsers. It does show up in Chrome and Firefox. Is there another setting or something I need to do to ensure the splash screen shows up in Explorer and Edge? Any help is greatly appreciated!!!!!!!
Non-responsive project? Did you follow the instructions I posted in the link to my blog post (longer than this video)?
Yes, and the splash screen appears in Chrome and Firefox, but not in Internet Explorer and Edge?
Hello Karen, I have tested again with IE and Edge and it works on my side. May be have you some options in the settings of your browsers that prevent a normal display.
Hi Jean,
Thanks for checking. I will have to have IT check the browsers on our network.
FYI, I changed the image to a jpg and it worked in all browsers. I Still do not know why the png did not work in IE or Edge.
hi great tutorial! when i change my width/height of the play_icon in the css, my entire loading screen image is bumped up the bigger i make my clickable area. im trying to make the entire screen (1024×768) clickable.
A reference to the original posts/threads published about this problem, with multiple solutions added would have been a nice supplement to your tutorial. Here is one link which I updated recently because the blue focus rectangle around the play icon has been removed in CP2019.
https://elearning.adobe.com/2018/03/get-rid-white-start-screen-black-button-html-output/
Hello Lieve, as written at the top of the page I have published this video at the beginning of September 2017 and it would have been difficult to make a reference to your page written more than 6 months later. You had also let comments on my Youtube channel about this video one year ago. It is a good idea to make an update for Cp 2019 here, for you and for all users as well.
Wow, what a neat way to learn how to add a splash screen. I had no idea! Thank you so much for sharing. Great work.
This is an excellent tutorial. Thank you so much. Getting rid of the mobile arrow will make it look much better. Is there anyway to have the Splash screen come up for a few seconds and then continue to run the Captivate Project without the user having to click. So I guess what I’m asking is there a way through maybe JavaScript to generate a click?
Hi thank you for your appreciation.
Displaying the Splash screen for a few seconds and getting the project automatically without clicking is not possible from Captivate. To me the solution is the one you mention with Javascript but I don’t have deep knowledge of Javascript and unfortunately I am not able to give you a solution.
I hope a person reading this will give us the relevant js file to modify with the code. it would be cool.
You can also read in the Showcase section this step by step process that shows how to make a splash screen with several pictures (and not only one) in order to get a different picture according to the used device. That makes it a splash screen really responsive:
https://elearning.adobe.com/2017/11/make-a-responsive-splash-screen-with-several-pictures/
I already commented on the video in YouTube. Thanks for posting this!
You must be logged in to post a comment.
