I have a project in Edge with a couple of screens as symbols on layers in the main timeline. I've been trying to write a function in the global scope that I can call from all the buttons, to show and hide screens.
So far I have a function that looks like this:
function mainScreenOut (){
sym.$("screen1").hide();
}
But this and many variations don't seem to work. how to use these jquery commands properly?
I'd like to target all child symbol instances of my mT symbol and hide them.
Something like this (except this doesn't work):
childsymbols_d1 = sym.getSymbol("holder").getSymbol("d1").getSymbol("mT").getChildSymbols();
for(var i=0; i<childsymbols_d1.length; i++){
childsymbols_d1[i].hide();
};
I don't want to use the timeline because I have a lot of child symbols, and would like to do this operation on several other symbols.
I have two elements that need to be hidden:
"mov-imp"
"mov-pim"
Currently, I am doing this:
var arr = ["mov-imp", "mov-pim"];
// This is the onclick function
sym.$.each(arr, function(){
$(this).hide();
}
)
What's the best way to show/hide multiple elements/symbols in AE?
Edge Animate project produces 4 default framework files right now: Edge API, jQuery, jQuery Easing and JSON. Gzipping them we got 60KB of pure JS compressed and minified code. After that we have actual project files which can be compressed into around 20KB but this really depends on a project. So finally we have around 80KB of JS code without images, styles yet. This is acceptable for broadband connections but looks a bit too large for mobile devices.
Is there any way to minimize dependencies on jQuery so that framework will be at least 30KB? Smaller is better in this case.
I'm evaluating Hype by Tumult at the same time and framework JS produced is 16KB compressed and minified. It's 4 times smaller (60KB of Edge Animate). It doesn't contain IE-compatibility though but I don't seriously care about IE 6-9 as mobile is primary target for me so Webkit.
Just wondering if I can update the jQuery Library in Edge 1.5. It uses 1.7.1 and I know 1.10 is out. Can I do this or do I stay with 1.7
View 3 Replies View RelatedI want to create on the symbol an mouse over event that address the same symbol.
i've tried
this.css("display","none");
with no success..
have made draggable and droppable objects in my project. Everything is working great but also i have made a button Restart. The function of restatrt is that by pushing on this button everything goes on its places. Like reloading the page (but of course without reloading) How can i do this? Because i cannot do anything honestly.
View 6 Replies View RelatedI would like to use the Jquery Address plugin with an Adobe Edge Animate project. When I create a simple website without Edge, I can easily use the Jquery Address plugin and implement it but here I'm a bit disappointed because I'm not really a developer and I don't know how to do.
I find more friendly the fact to be able to use the browser arrow to reresh, navigate previous and next page. Maybe it can be added in a future update of Adobe Edge ?
Possible to have pullout tabs with content working inside edge?
View 10 Replies View RelatedI want to have some kind of collision-detection within two symbols. So when one symbol collides with another there will appear be text like "squash" or something.
I haven't found anything about collision-detecting in edge animate, but I thought I could handle it with looking for the same css-parameters of both symbols. Obj1 is moving to Obj2 on a motion path. Now I want to have a Text, when it reaches Obj2.So I tried it like this:
var positionobj1 = sym.$("obj1").css("left");
var positionobj2 = sym.$("obj2").css("left");
if (positionobj1 == positionobj2){
sym.play("Text");
}
I have create a small Edge Animate animation that I'm trying to add to our home page. After getting everything running and working properly in IE9+, Chrome, Firefox and Safari I moved it from the development environment to our live site. Then I viewed it on an older machine running IE8 and the down level stage worked great, but it disabled a jquery image slider and a little custom jquery script I wrote to polite load an embedded youtube video. The only cusomization I did to the edge files was to remove the loader for the included version of JQuery so that it would run the on I call from Google instead. This prevent intial conflicts between already existing jquery elements on the page.
View 2 Replies View RelatedGot a nested symbol. Rather simple one. Inside the symbol is a background rectangle and a text field. When I click a button, it should insert the HTML I give it from the click event.
Now initially I did this by just using the text field by itself. No nesting. This is the code:
sym.$("copy").html("Edge Rocks!");
OK, success! The text loaded just fine.
Now let's insert that text field inside of a symbol. And let's call that symbol 'content'.Now I try....
sym.$("content").$("copy").html("Some new text");
Result? Nothing.
Tried using stage instead of sym and even added a var stage = sym.getComposition().getStage() statement before that. Nope.
I have come across about a dozen similar discussions, but most have presented solutions that worked in earlier versions of Edge and no longer work.
I am trying to use Edge to build animations that can then be integrated into larger non-Edge projects. I would like to then be able to control the Edge timeline or Edge symbols from elements OUTSIDE of Edge, such as another link or button in the page.
I cannot seem to figure out how to properly reference the Edge stage or symbols.
I have come across several proposed solutions for referencing Edge stage, such as:
var comp = AdobeEdge.getComposition("EDGE-966604542");
var stage = comp.getStage();
var comp = $.Edge.getComposition("EDGE-966604542");
var stage = comp.getStage();
var comp = Edge.getComposition("EDGE-966604542");
var stage = comp.getStage();
and these either DO NOTHING or throw errors about either AdobeEdge or Edge or comp being undefined.
Is there way to revert or un group assigned symbols?
View 2 Replies View RelatedI am trying to make a fairly simple user interface. I have 3 buttons on stage and each button will pull out a correspoinding symbol from the library and display it on the stage.
Eg. Click btn1 and it will show content1 from the library.
So far it is working in that it shows the corresponding content but it appends subsequent content to the bottom of it. I need the content to be replaced instead.
I would prefer if I could dynamically get content from the library instead of having items on stage that are set to 'hide' and 'show'.
Note: I noticed that when you create a child symbol on stage that Edge gives it a randomly generated ID. There is some code towards the bottom that tries to rename its ID attribute. I am not 100% sure if it is even doing what I expect it to do.
var btnArray = ['btn1','btn2','btn3']
function init(){
for (var i = 0; i < btnArray.length; ++i) {
[Code]....
I need to activate a timeline event on a symbol with a button press on another object, then when the button is pressed again, reverse the timeline event. This will have something sliding in and out of the stage.
If the animation is placed right at 0.00 and there's nothing else, then this code works OK:
if (sym.getPosition() == 0)
{
sym.play();
}
else
{
sym.playReverse();
}
However there is other animation that plays automatically on page load, then a trigger stops all animation. The animation I need to trigger is a couple of seconds later bracketed by labels 'start' and 'stop'. So I need to code the button A to get the symbol B and animate from 'start' to 'stop' and then wait. Then on a further press to animate from 'stop' to 'start'. But I'm damned if I can get anything to work.
I want a command that sets a symbol's timeline position based on another symbol's timeline position.
My case: Im making a intercative animation of a room, where i have a black screen symbol ("filmepreto") with a opacity animation over my room image. That symbols adjusts de room ilumination.
I have a symbol with an animation of a curtain closing (cortina) and another one with a roof lamp that gets on or off controlled by a button. When the button that turns the roof lamp the position of the "filmepreto" must be the same of the curtain. Both the curtain animation and the "filmepreto" animation have the same lenght.
I have more things that interefere on the ilumation of the room but, if I have the code to sync the off state of them with the position of the curtain animation i think I can set everything.
I created 5 buttons in Edge CC that appear one after the other. After converting them to symbols, they still appear one after the other in the timeline, but in a browser preview they all appear at the same time.
View 2 Replies View RelatedI need to hide a symbol on my main stage dynamically, ie without hardcoding it on the timeline. So I tried this within an IF ELSE statement:
sym.getComposition().getStage().getSymbol("Box_Symbol").hide();
I also tried this:
sym.getComposition().getStage().getSymbol("Box_Symbol").css({"display","none"});
Clearly these are not working..
I'm building an animated menu in the latest version of Adobe Animate. There are 5 different animations that happen within the same box on the main stage. I have made each animation it's own symbol. I want to trigger the animations from text boxes to the left of the box where the main animation takes place. The text boxes are not apart of any of the symbols, but are just on the main stage.
When someone scrolls over any of the individual text boxes i need to play one symbol's timeline AND hide all of the other symbols from the stage.
I've been experimenting with different ways to control the appearance of my symbols and elements.
I've seen multiple examples where people would add custom styles to the head of the html document created by edge. I've tried this, but no matter how I tweak it, I can't seem to get it to work. I've tried adding it to the existing edge runtime <style> tag, creating my own <style> tag (both before and after the edge runtime) and then adding the CSS into that, but to no avail. I have tried adding the class to both symbols and elements on the stage using both jQuery and that class form field next to the element name. I've also made sure to close out of the project before I add my styles, just in case that was the problem.
I feel like there might be some edge animate terminology/notation thing that I'm missing, because it seems like it should be a pretty straightforward process.
I am wondering how I could control multiple symbols using classes.
So lets say I have 10 symbols on the Stage - each symbol has a class of 'box'
Using this:
sym.getSymbol('.box').play('lower');
only the first box will animate, not the other 9.
So my animation is a song and I'm doing like a video clip with interactivity (the interactivity is not inside at the moment).I need to have a play button so we can see (heard) on iPhone, iPad...
My problem is that the animation begin immediately behind the play button and before I press it.So the song and the animation are not synchronize.I try many things to stop the animation but nothing is working.
It seems that the order of symbols that I get back from sym.getComposition().getSymbols("symbolname") doesn't correspond to the order they were created or their order in the Elements table or their order in the timeline list. What determines their order in the array? How can I sort based on y position on stage or order of creation?
View 1 Replies View RelatedI have a parent symbol (symbolA) that contain another symbol (symbolB). when I click on the inner symbolB, I want to make it switch with a third symbol (symbolC) always inside the symbolA.
View 4 Replies View RelatedI have a rectangle (Named "Data") that falls down the stage on a loop. This is all contained within the symbol itself. The stage has this code in it:
var randX;
var randShouldWait;
var randSpeed;
[Code].....
This creates a nice looking randomized "shifting" as the block falls. The issue is that this code is specifically related to the "Data" object and when I duplicate the symbol it names it "Data_1" which obviously doesn't shift randomly. The goal is to have this expandable to have dozens of these rectangles at once, so Ideally I'd like to find a way to create new ones programmatically that each have individualized behavior so my timeline isn't so busy.
how can I call a label placed outside of a symbol's timeline in edge animate? I made a droppable symbol and now I need an action (for a button... making click) to return to the principal stage to a specific label.
View 3 Replies View Relatedso user error is not unlikely, but I have a small animation with 11 small circles that animate opacity and Y pos. The circles are all symbols and are being controlled (play/stop) from the main timeline. When I preview, half of them do not show up. The symbols that don't appear are consistent from preview to preview. I've looked at the Elements in the browser and they are there, they just aren't animating.
So I thought I would just recreate the "bad" symbols and their animations, but they are still not animating in my preview. When I play the timeline in Edge Animate evrything is fine.
I've tried it in Chrome, Safari and Firefox (all latest releases) with the same result.
Is there a symbol bug in Edge? Is there a method of creating symbols that I should be using (other than draw, cmd-Y and edit symbol timeline)?
So I have an interactive piece with several shapes. There are about 5 rectangles, 3 horizontal and 2 vertical. For aesthetics and to fit them all in the space (stage), they overlap slightly. Whenever you mouseover a single rectangle it pushes the other rectangles away and a text bubble appears. When you mouseout, the text box goes away and the rectangles return to their original position. This worked without glitches when I applied it to the first rectangle. Now that I'm applying this to all of the other rectangles, I'm running into trouble. I'm thinking the trouble is with the overlapping portion. If you hover one rectangle where it overlaps another rectangle for a split second it plays the correct animation but then I think it tries to also play the animation for the other overlapping rectangle that appears underneath.
So my question is, what is the best way to remedy this problem? On mouseover can I temporaily disable mouse events for the other rectangles once one has been triggered? And then maybe re-enable them on mouseout? Is there a way for the rectangle that is visually on top to be the one that recieves the mouseover event?
I need to apply the very same motion path to multiple objects. Is there a way to copy the motion path from a symbol to another? I can't find a way to do this.
View 1 Replies View RelatedI'm trying to use ".createChildSymbol" to bring my symbols from the library to my stage. And in each symbol I have an OUT label, so every time a new symbol is called by a particular button, the last one plays from OUT label and new one appears at the same place. It's all easy for two symbols and I do not need to set any vaiable for them. But I have almost 180 symbols, and a menu of buttons to call them, so every button needs to play the OUT label of the current symbol and also plays the new one and make it as the current one.
sym.test = sym.createChildSymbol("test", "Stage");
sym.getComposition().getStage().setVariable("current", "test");
var current = sym.getComposition().getStage().setVariable("current");
sym.current.getSymbolElement().css({position:'absolute', display:'inline-block', top:167, left:91});