Several HTML5 animations on the same page
Hi all, I'm new to Digital Publishing Suite.
I've added several animations of HTML (3-4) on my page. but I want that every next animation to play when I click on the page.
The problem I face is that all the animations start to play at the same time. What I want is that the following animation should play only when I click on the page and so on...
I tried to add the delay to different animations and setting autoplay for the first animated film... but that did not help.
All solutions/advice?
Thanks & regards
You can use a MSO on the date for the next steps of the State
Tags: Digital Publishing Suite
Similar Questions
-
How to load several HTML5 canvas on the same page (the right way)
Hello
I struggled to load several animations of canvas on the same page. At the beginning, I thought that export movies with different namespaces and reload the libraries in a sequential workflow might work, but it doesn't. It still load just the last loaded movie. More info here: coding challenge: what am I doing wrong?
Here's a sample of what I'm doing:
1: publish two flash animations with namespaces customized to "lib" defined in the "publication settings": "libFirst" and "libSecond".
2nd: Edit the canvas tags in the HTML page. One called "firstCanvas" and another one called "secondCanvas".
3rd: change the javascript like this:
<script> // change the default namespace for the CreateJS libraries: var createjsFirst = createjsFirst||{}; var createjs = createjsFirst; </script> <script src="//code.createjs.com/easeljs-0.7.1.min.js"></script> <script src="//code.createjs.com/tweenjs-0.5.1.min.js"></script> <script src="//code.createjs.com/movieclip-0.7.1.min.js"></script> <script src="{{assets}}/js/first.js"></script> <script> function initFirstAnimation() { var canvas, stage, exportRoot; canvas = document.getElementById("firstCanvas"); exportRoot = new libFirst.first(); stage = new createjsFirst.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjsFirst.Ticker.setFPS(libFirst.properties.fps); createjsFirst.Ticker.addEventListener("tick", stage); } </script> <script> // change the default namespace for the CreateJS libraries: var createjsSecond = createjsSecond||{}; var createjs = createjsSecond; </script> <script src="//code.createjs.com/easeljs-0.7.1.min.js"></script> <script src="//code.createjs.com/tweenjs-0.5.1.min.js"></script> <script src="//code.createjs.com/movieclip-0.7.1.min.js"></script> <script src="{{assets}}/js/second.js"></script> <script> function initSecondAnimation() { var canvas, stage, exportRoot; canvas = document.getElementById("secondCanvas"); exportRoot = new libSecond.second(); stage = new createjsSecond.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjsSecond.Ticker.setFPS(libSecond.properties.fps); createjsSecond.Ticker.addEventListener("tick", stage); } </script> <body onload="initFirstAnimation(); initSecondAnimation();">Could someone please answer with best practices on how to do it? If possible, without the need to reload all libraries...
If I only need to show a flash animation at the same time, it would be more efficient to cut/paste the canvas using jQuery tag in the DOM and reload a different lib on this subject?
Thank you very much!
#flash #reborn
I was able to remedy. In the end, it was easier than I thought. Just publish using namespace different 'lib' for each film, load all the scripts at the end of the
and add the following in the onload or ready events:$(document).ready(function () { var canvas, stage, exportRoot; // First movie canvas = document.getElementById("firstCanvas"); exportRoot = new libFirst.first(); stage = new createjs.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjs.Ticker.setFPS(libFirst.properties.fps); createjs.Ticker.addEventListener("tick", stage); // Second movie canvas = document.getElementById("secondCanvas"); exportRoot = new libSecond.second(); stage = new createjs.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjs.Ticker.setFPS(libSecond.properties.fps); createjs.Ticker.addEventListener("tick", stage); // Third movie canvas = dument.getElementById("thirdCanvas"); exportRoot = new libThird.third(); stage = new createjs.Stage(canvas); stage.addChild(exportRoot); stage.update(); createjs.Ticker.setFPS(libThird.properties.fps); createjs.Ticker.addEventListener("tick", stage); }); -
I can't create several different uls on the same page
There is a nav - ul on the page.
#online - nav ul {}
text-align: left;
display: block;
padding: 5px;
Width: 130px;
margin: 5px;
list-style-type: none;
}
I need uls several points, squares etc. on the same page, width 300px and text sizes different and color etc. But every time I get ul I get the same div as above. How can I change the new lists?Thank you, that's all.
-
Several resources working on the same page ADF / same application
Hello
Sorry this is perhaps a fundamental question for some of you. But I really need experts.
First question is:
I'm working on JDEV 11.1.1.3.0 developing ADF UI. In one of my page, I have 12 tabs and around 6 pop-up windows. This is a page that some complex. So we can distribute the same application and the same page different resources and allocation of development different tabs? If Yes, then how we can merge?
Second question is:
I'm really curious to know how the major projects of the ADF are developed?
Thank you
MCA way to divide the work is to use fragments of the page inside the taskflows for each tab.
Then, each developer can work on her page fragment, and in the end you just add these taskflows as a region to your homepage.
Of course, you want to also use a central Subversion (or other SCM system) repository to synchronize the work on your project-level files. -
Several interactive reports on the same Page (re example of Jari)
Hello-
I'm [referring to the example of Jari | http://apex.oracle.com/pls/otn/f?p=41715:23]
It is really great, but I have a few questions...
I would like to solve these two first.
1. my Developer toolbar (which is the name? for the links at the bottom of the page?) are winding up in the i-Frame of order details, rather than at the bottom of the actual page... no way to avoid this?
2. the instructions in step 4 wrote:
-Empty the Cache: 24, IRB (clears the cache of the IR on Page 24)
I understand where and how set him clear the cache of page 24.
I don't understand what is IRB.
Thank you-
MarionMarion
Ok. I undid the changes I had made earlier.
I now put the link in the column of the parent report as
IR_WRAP_SALE_ID-#WRAP_SALE_ID #.and specified that the cache clean for the comprehensive report in page 2.
CITY
-
Several interactive reports on the same page
Is it possible to work around the limitation to 1 report Interactive by page? If so, how?
It is possible to use accordions (a control of type Iframe on a page) to allow multiple interactive reports that can be DISPLAYED on a page, even if they exist on separate pages...
Thank you
Tony Miller
Software LuvMuffin
Ruckersville, WILL -
Bug. Can not put two edge animations animate on the same page
Alrighty. Just thanked Adobe for fixation sensitive question scaling. Now, it seems to be a new. When I put two animations dashboard run on the same page, they both disappear completely from the view! Both in mode live view (or which saw fluid grid) and trying to get a glimpse into any browser. The responsive design works fine but if I put two animations on the same page that the two just disappear! GONE!
Perhaps there is a code that I can use to prevent this. I did a number of tests during the last hour. My smile (from the reactive solution) is now again a frown. I can't keep working like that. Please let me know if there is something I am doing wrong. I have two animations on a page without worries prior to this version, but the delicate design did not work properly. The responsive design work NOW, but I can't have MORE than ONE ANIMATION on the same page. Thanks for your time. Best regards, Julian.
The use, I did the modification required: