Copy link to clipboard
Copied
Can anyone tell me how to remove the play button that apears on a white screen before the course starts? it only shows on the iPad and if this is going to be published as an IOS app using phone gap build i dont want this to show.
I have found some javascript that i have tried but it dosent seem to remove the white screen or browser warning does anyone know the correct javascript to use?
Current Javascript:
http://floatlearning.com/2013/10/a-more-mobile-friendly-captivate-html-template/
<script type='text/javascript' src='assets/js/fastclick.js'></script>
<script type='text/javascript'>
$(function() {
FastClick.attach(document.body);
$("#CPUnSupportedBrowserWarning_ID").remove(); // Removes browser warning
cp.movie.play(); // Skips play button screen
});
</script>
I am using the latest version of Captivate 7.0.1 on Mac
Thanks,
Oliver
Copy link to clipboard
Copied
Here is a thread offering solution on the browser warning issue.
http://forums.adobe.com/message/5882655#5882655
Sreekanth
Copy link to clipboard
Copied
Look in the HTML file that Captivate created.
Near the bottom there should be a function called "function ContinueCPInit()"
put the cp.movie.play(); directly after the following line:
document.getElementById('playImage').focus();
cp.movie.play();
Copy link to clipboard
Copied
Hey, thanks for you reply
I cant seem to find that function this is what captivate 7.0.1 generatesin terms of HTML:
<!DOCTYPE html>
<html>
<head>
<meta name='viewport' content='initial-scale = 1, minimum-scale = 1, maximum-scale = 1'/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="x-ua-compatible" content="IE=10">
<title>Brainstorming eLearning Course</title>
<style type="text/css">#initialLoading{background:url(assets/htmlimages/loader.gif) no-repeat center center;background-color:#ffffff;position:absolute;margin:auto;top:0;left:0;right:0;bottom:0;z-index:10010;}</style>
<script>
function initializeCP()
{
function cpInit();
cp.movie.play();
{
document.body.innerHTML = " <div class='cpMainContainer' id='cpDocument' style='left: 0px; top:0px;' > <div id='main_container' style='top:0px;position:absolute;'> <div id='projectBorder' style='top:0px;left:0px;position:absolute;display:block'></div> <div class='shadow' id='project_container' style='left: 0px; top:0px;position:absolute;' > <div id='project' class='cp-movie' style='width:1024px ;height:748px '> <div id='project_main' class='cp-timeline cp-main'> <div id='div_Slide' onclick='cp.handleClick(event)' style='top:0px; width:1024px ;height:748px ;position:absolute;-webkit-tap-highlight-color: rgba(0,0,0,0);'></div> </div> <div id='autoplayDiv' style='display:block;text-align:center;position:absolute;left:0px;top:0px;'> <img id='autoplayImage' src='' style='position:absolute;display:block;vertical-align:middle;'/> <div id='playImage' tabindex='9999' role='button' aria-label='play' onkeydown='cp.CPPlayButtonHandle(event)' onClick='cp.movie.play()' style='position:absolute;display:block;vertical-align:middle;'></div> </div> </div> <div id='toc' style='left:0px; float:left;position:absolute'> </div> <div id='playbar' style='left:0px; float:left;position:absolute'> </div> <div id='cc' style='left:0px; float:left;position:absolute;visibility:hidden;pointer-events:none;' onclick='cp.handleCCClick(event)'> <div id='ccText' style='left:0px;float:left;position:absolute;width:100%;height:100%;'> <p style='margin-left:8px;margin-right:8px;margin-top:2px;'> </p> </div> <div id='ccClose' style='background-image:url(./assets/htmlimages/ccClose.png);right:0px; float:right;position:absolute;cursor:pointer;width:13px;height:11px;' onclick='cp.showHideCC()'> </div> </div> <div id='pwdv' style='display:block;text-align:center;position:absolute;width:100%;height:100%;left:0px;top:0px'></div> <div id='exdv' style='display:block;text-align:center;position:absolute;width:100%;height:100%;left:0px;top:0px'></div> </div> </div></div><div id='blockUserInteraction' class='blocker' style='width:100%;height:100%;'> <table style='width:100%;height:100%;text-align:center;vertical-align:middle' id='loading' class='loadingBackground'> <tr style='width:100%;height:100%;text-align:center;vertical-align:middle'> <td style='width:100%;height:100%;text-align:center;vertical-align:middle'> <image id='preloaderImage'></image> <div id='loadingString' class='loadingString'>Loading...</div> </td> </tr> </table></div> <div id='initialLoading'></div>";
cp.DoCPInit();
}
if((typeof InitAppPackager !== "undefined") && (typeof InitAppPackager === "function"))
{
InitAppPackager(cpInit);
}
else
{
cpInit();
}
}
</script>
</head>
<body>
<div id='initialLoading'></div>
<script>
(function()
{
if(document.documentMode < 9)
{
document.body.innerHTML = "";
document.write("The content you are trying to view is not supported in the current Document Mode of Internet Explorer. Change the Document Mode to Internet Explorer 9 Standards and try to view the content again.<br>To change the Document Mode, press F12, click Document Mode: <current mode>, and then select Internet Explorer 9 Standards.");
return;
}
window.addEventListener("load",function()
{
setTimeout(function()
{
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'assets/js/CPXHRLoader.js';
script.defer = 'defer';
script.onload = function()
{
var lCSSLoaded = false;
var lJSLoaded = false;
function constructDIVs()
{
if(lCSSLoaded && lJSLoaded)
{
initializeCP();
}
}
cpXHRJSLoader.css('assets/css/CPLibraryAll.css',function() {
lCSSLoaded = true;
constructDIVs();
});
var lJSFiles = [ 'assets/js/jquery-1.6.1.min.js','assets/js/CPM.js' ];
cpXHRJSLoader.js(lJSFiles,function()
{
//console.log("js loaded");
lJSLoaded = true;
constructDIVs();
});
}
document.getElementsByTagName('head')[0].appendChild(script);
},1);
},false);
})();
</script>
<noscript style="text-align:center;font-size:24px;">Enable Javascript support in the browser.</noscript>
</body>
</html>
Copy link to clipboard
Copied
You should be able to check autoplay in the preferences/project/start and end/, but that is persnickety. Adobe changed the html file in the update. Put it here:
cp.DoCPInit();
}
if((typeof InitAppPackager !== "undefined") && (typeof InitAppPackager === "function"))
{
InitAppPackager(cpInit);
}
else
{
cpInit();
}
cp.movie.play();
}
</script>
</head>
Copy link to clipboard
Copied
Hey thanks for your help, that works great! in the iOS safari browser but when I convert my HTML5 package to an ISO App using phone gap the play screen appears again any ideas why that is do i need to place the cp.movie.play(); somwhere diffrently just for the IOS app version?
Thanks,
Oliver
Copy link to clipboard
Copied
Sorry, can't help you there. Never used Phone Gap, so I don't know what the package does to the file. Even if you select autoplay, CP still puts the screen with the play button in your file. You would have to dig through all of the script and find out how it is turning the div on and off and playing the movie.
Copy link to clipboard
Copied
Hi
Has anybody figured out how to remove the Play button when the HTML5 package is published via PhoneGap? I want to get rid of that from the Android app I created.
Sreekanth