I'd like to be to stop and run the animation when needed.
↧
is there a way to interact through javascript with an embedded edge animation?
↧
how to prevent edge animate from loading jquery if it's already loaded elsewhere
i'm using edge animations on my page via the wordpress edge suite plugin, and i noticed it's loading jquery - i believe this was included when publishing my animation.
<script src="http://mysite.com/wp-content/uploads/edge_suite/edge_includes/jquery-2.0.3.min.js"></script>
but in wordpress jquery is loaded by default.
<script src="http://mysite.com/wp-includes/js/jquery/jquery.js?ver=1.11.0" type="text/javascript"></script>
how can i prevent edge animate from causing jquery to load twice?
↧
↧
"The application was unable to start correctly(0xc000007b)."
I just had Edge Animate CC installed on my computer. Everytime I try to open it I get the following error:
"The application was unable to start correctly(0xc000007b)."
I saw that there was some help for other apps (like Lightroom) but I couldn't get any information for Edge Animate.
I have a 64bit Windows 7.
↧
Web Page Turn
↧
Dynamic Photo Load Lag
Hello,
I am trying to dynamically populate a cube ad with photos and text from a json file. The fields that are populated are photo, title, desc and price. When I initially created the ad I had a photo and 3 text fields. After a 5 second animation, the count would increase by 1 and all fields would be repopulated. When I tested this the text worked perfectly but there was a lag in the photo switch. My solution was to create a second set of fields to run the following way:
Slide A (visible): Photo, Title, Desc, Price
Slide B (hidden): populated with the next Photo, Title Desc, Price
5 second animation, then switch
Slide B (Visible)
Slide A (hidden) repopulated with the next Photo, Title, Desc, Price
5 second animation, then switch
Loop back to the top...
This set-up works through the first run through but then the photo starts lagging again.
Can anyone help me solve the lag issue? Below is my compositionReady stage code. I will also include a zip of my project. I moved Slide B 300px to the right and took out the hide functions so I could see what was happening behind the scenes. I also included some helper text fields to show what functions are being called while it is running.
compositionReady Code:
//Variable
imageCount = 0;
//JSON
$.getJSON("slides.json", function(data){
loadDataA(imageCount);
// Load Data A
function loadDataA(i) {
sym.$("notification1").html("loadDataA");
sym.$("photo").empty();
sym.$("photo").attr("src", data[i].image);
// Populate text A
sym.$("title").html(data[i].title);
sym.$("desc").html(data[i].desc);
sym.$("price").html(data[i].price);
sym.$("notification5").html("photo image = " + data[i].image);
}
// Load Data B
function loadDataB(i) {
sym.$("notification1").html("loadDataB");
sym.$("photo2").empty();
sym.$("photo2").attr("src", data[i].image);
// Populate text A
sym.$("title2").html(data[i].title);
sym.$("desc2").html(data[i].desc);
sym.$("price2").html(data[i].price);
sym.$("notification6").html("photo2 image = " + data[i].image);
}
function hideAshowB() {
sym.$("notification2").html("hideAshowB");
sym.$("photo").empty();
//sym.$("photo").hide();
//sym.$("title").hide();
//sym.$("desc").hide();
//sym.$("price").hide();
sym.$("photo2").show();
sym.$("title2").show();
sym.$("desc2").show();
sym.$("price2").show();
}
function hideBshowA() {
sym.$("notification2").html("hideBshowA");
sym.$("photo2").empty();
//sym.$("photo2").hide();
//sym.$("title2").hide();
//sym.$("desc2").hide();
//sym.$("price2").hide();
sym.$("photo").show();
sym.$("title").show();
sym.$("desc").show();
sym.$("price").show();
}
function animateSlideshowA() {
sym.$("notification3").html("animateSlideshowA");
sym.$("title").animate({x: 9}, 5000, function() {
sym.$("notification4").html("insideSlideshowALoop");
imageCount++;
if (imageCount >= data.length) {
imageCount = 0;
}
loadDataA(imageCount);
hideAshowB();
animateSlideshowB();
});
}
function animateSlideshowB() {
sym.$("notification3").html("animateSlideshowB");
sym.$("title2").animate({x: 309}, 5000, function() {
sym.$("notification4").html("insideSlideshowBLoop");
imageCount++;
if (imageCount >= data.length) {
imageCount = 0;
}
loadDataB(imageCount);
hideBshowA();
animateSlideshowA();
});
}
loadDataA(imageCount);
imageCount++;
loadDataB(imageCount);
animateSlideshowA();
});
www.capitalpress.biz/html5ads/cubes/nyssatractor/NyssaDynamicTest.zip
Thanks for your help,
Brandon
↧
↧
How can I detect end of HTML5 video and do something?
var vid = sym.$("Holder");
vid.html('<video width="720" height="405" id="myVideo" src="http://content.jwplatform.com/videos/GwRORsk1-gBf37dJ7.mp4" type=video/mp4 controls="controls" autoplay="autoplay" </video>');
↧
How to remove the Animation-status bar under the animation using a .OAM file
Hi.
I created a composition-animation ( .OAM file ), to download it into the Dreamweaver and get executed in my webpage, which is almost ready the home page, are missing some things., but this is a very important issue I have to fix.
Check it out at the webpage :
www.streamlivemontreal.com
the attached file is the animation file with the .js and the .oam file included.
↧
Edge animate - You tube video does not support in Mozilla Firefox ?
Hi,
I have embed below code in edge animate for youtube video in browser. This code is work fine in IE, Chrome, and other browser. But this code does not work in Mozilla firefox.
Here is code:
var youtubevid = $("<iframe/>");
sym.$("vcontainer").append(youtubevid);
youtubevid.attr('type','text/html');
youtubevid.attr('width','425');
youtubevid.attr('height','350');
youtubevid.attr('src','http://www.youtube.com/embed/ZHUjDWpHJvU'); // url/Video_Id
youtubevid.attr('frameborder','0'); // 1 | 0
youtubevid.attr('allowfullscreen','0'); // 1 | 0
PLz help me...
Thanks
Susanta Kumar Muduli
↧
Animated button for desktop and iPad
I want to create an animated button. On desktop: when hovering the button it animates form an icon to text. When clicking you must go to a certain link. On mouse out it has to animate back to the icon. On an iPad you can't use hover, you should touch once and get the animation (to text), and touch again to go to the link. When touching an other button, the previous button shout animate again (to the icon), etc ...
I'm fairly new to Adobe Edge Animate, and not such a good coder. I will be someday I hope ...
This link will show you the squares (icons) so you could see what I'm talking about:
NB: I start with unrotated squares, at the end I rotate the DIV 45°, els the 'hover/touch'-parts will overlap and not work properly.
I hope that I'm clear and that someone could help me out a little bit.
↧
↧
Center elements or symbol on stage
How can I center my symbols or elements on a responsive layout. The plan is the blue bar will change width across the stage and the navigation menu (which is individual symbols grouped together) centers when browser resize
↧
Load and start animation after the page is loaded
Hi, all.
Recently I had a very difficult problem here with Adobe Edge. I have a page where an Edge animation should only load and execute AFTER the page was completely loaded. It was inside a local Adobe DPS HTML webview. We want the animation only execute IF the iPad was 2 or newer. If the iPad was iPad 1 a generic, static content should be showed.
So, i did something like this in my HTML file, in the end of the body
<script>
// if iPadVersion === 1 (or the user clicks a button or whatever, load an external Edge Animation and play it):
var script =document.createElement('script');
script.src="index_v_edgePreload.js";
document.getElementsByTagName('head')[0].appendChild(script);
</script>
Guess what? It never works. Edge only start the animation when i put the tag directly in Head element. Explicitly. Any attempt I did to "lazy load" an Edge Animation failed silently. The script tag was correctly wrote in the HTML, all other assets in the animation were apparently correctly loaded as well, but the animation never started.
These are my questions:
1) Can I load an Edge animation after the page has fully loaded? For exemple, if a user clicks a button in the page?
2) Can I load more than one animation and control them with buttons or events outside Edge (for example, with parallax scrolling) independently?
3) How do I unload or "stop" an animation based on external events (like, for example, the user clicks a button that "closes" a lightbox that has a Edge animation inside going on)?
4) Can I load the very same animation many times in different DIVs elements and execute them in different times? Can I stop, play, pause the animations independently, even being the same animation?
All these questions are very important to me, because i use to do many applications with different scenarios where Edge would be one of many animations I want see in page, but not only.
Thank you.
Pedro Paulo Almeida
Front-End Developer
São Paulo, Brazil
↧
is there a way to use angular.js in edge animate
I am trying to add angular.js to my edge animate composition to use for a game. I want to use ng-model in input fields to store player information. I can't seem to get this to work by using. I have added the angularjs script using the add script feature and yepnope way. and this is what i have for my input field and label I want it to be binded to.
var namelabel0 = sym.$("nameInput0");
namelabel0.html('<form name="myForm" ng-app="" ng-controller="Ctrl"><input type="text" name="input" ng-model="user1"></form>');
var namelabel1text = sym.$("Text");
namelabel1text.html('{{user1}}');
↧
Edge and iPads, troubleshooting
So i'm fairly new to the world of Edge Animate. I'm familiar with coding, animation, quite a bit actually.
So I have created a demo to be touch-interaction only (for the iPad). So when I go to use Edge Inspect through Chrome, my animation just flashes uncontrollably when previewed in Chrome. I mean elements that aren't even supposed to be on the Stage yet are blinking like crazy and I cannot seem to pinpoint the issue. It should begging with a nice fade-in animation and then stop. But instead…
Since i'm new to Edge Animate. I wanted to know if there was something that I was missing. Possibly a piece of code that's supposed to go at the start of the animation that i've completely missed or something? I can post screen grabs of any and all aspects if that helps?
Thank you!
↧
↧
How can I get Preloader to work with my (Edge Animate) project?
I have carefully followed the instructions to set up a simple preloader gif for my fairly large project. After hours of torturous examination, I still cannot find out why the preloader gif does not appear. Can anyone help? The project is at:
To anyone that can see the problem, thanks in advance.
↧
iframe with Edge Animate not responsive on iPhone
I have successfully added an Edge Animate block to a Squarespace page. The only way I could figure out how to do it after scouring the Squarespace forums and googling was to use an iframe. It is working great EXCEPT for on the iPhone. The animation is not scaling so all you see is the top piece of it. Any ideas how to solve this?
Page:
https://karen-nagano.squarespace.com/
HTML:
Custom CSS:
.edge { width: 50%; margin: 0px auto; }
.iframewrapper { height: 0; width: 100%; padding-bottom: 49.78%; overflow: hidden; position: relative; }
.iframewrapper iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
Thanks in advance!
↧
CSS3 Animations
I am a developer and I understand that for heavy animations you may need multiple javascript libraries but I think with the rise of CSS3 there should be a option to have a "light" or "CSS Based" Animation Project where it is only CSS3 Animations and Transitions with jQuery. I understand that this is a big change just to have CSS based animations but I think designers should be able to take advantage of new web technologies. I love putting small animations in my websites but they are small and there for I don't want to load anything more on my page than I have to. CSS3 is very capable of many types of animations if used correctly and I think it will increase the use of Animate.
What do you think of having a "CSS Based" Animation?
What would you do?
↧
Adding navigation to parallax scrolling website?
Hello!
I'm building a parallax scrolling website, with different sections. The scrolling in question is quite long, so I have some navigation set up on the side to jump to the needed place on the timeline.
How would I go about this? I tried using the stop at, but it acts wonky with the scrolling...it jumps to the label, but it doesn't seem to take the scroll navigation control into account. I also tried using the following code:
sym.$("stage").scrollTop(0,2157);
...but it jumps to the top of the site, every time, no matter what x/y coordinates I input. I am using the following code to control the parallax scrolling on the stage:
// scrolling controls animation
var animationHeight = 24000
var stageHeight = sym.$("Stage").height()
var scrollPos = sym.$("Stage").scrollTop();
var duration = sym.getDuration();
var percent = scrollPos / (animationHeight - stageHeight);
var time = duration * percent;
// Update timeline
sym.stop(time);
Help?
Thanks,
Chad
↧
↧
Given filename or path contains Unicode or double-byte characters.Retry using ASCII characters for filename and path What does this mean? it happen when I publish an OAM
Given file name or path contains Unicode or double-byte characters. Retry using ASCII characters for filename and path
What does this mean? It is happening when I try to publish an OAM for Dreamweaver.
Also: How can I specify the browser in Edge Animate? It is just going wherever. Are there no Preferences for Edge Animate?
BTW. Just call it Edge. Seriously. Do you call it Illustrator Draw? Photoshop Retouching?
↧
No puedo descargar la versión de prueba
No puedo descargar la versión de prueba, dice (Se están produciendo algunos problemas; inténtelo de nuevo más tarde. Si el problema continúa, póngase en contacto con Asistencia al cliente.) pero aún así, no me deja descargarlo, después del tiempo de espera
↧
Updating Images in the Edge Library?
So if I have a .png in my library that i've brought to the stage, and then make a change in Photoshop and resave the file.
Is there then no way to update the artwork with changes in Edge?
↧