Edge Animate Menu with Page Highlights

Is there a way to make a menu in Edge Animate so that when you are on a certain page, that page is highlighted on the menu?
I want to make it a server side include

Move to Edge Animate CC

Similar Messages

How to link Edge animate elements with wordpress div id

Dear all,
I have an animation uploaded on wordpress with edge Suit;
In the animation there are some links to the sections of the page, but they don't work.
In my edge file I linked the elements to the wordpress sections just adding code "click ==> links ==> link in the same window -- window.open("http://mywebsite/#section", "_self");
I am sure its really easy to solve it, but i have some Jquery lacks.
thanks for your help
Alessio
Message was edited by: alessio Calveri

I can only imagine how miffed Adobe's technical team must be and I don't want to add unnecessarily to any stress. For what it's worth, I really liked working with the Edge Animate interface and want things to work out because it would be my first preference - but of course not if I have to recreate content elsewhere for the iPad.
Whether iOS7 has a bug or otherwise, I wonder if there are any simple workarounds. For example, there is an extension that outputs HTML5 from InDesign, including media overlays:
http://ajarproductions.com/pages/products/in5/#showMoreFeatures
https://www.youtube.com/watch?v=ku4Ql8GE1m8
Perhaps Adobe can create an updated step-by-step guide for inserting Flash canvas animations and Captivate HTML5 using this extension. Then maybe even show how to wrap the final content as EPUB3. This would be in lieu of this demo: https://blogs.adobe.com/captivate/2013/08/a-step-by-step-guide-to-create-an-interactive-eb ook.html. For people like me who use Adobe's products because of their front-end niceties (i.e. we don't want to dig too much into code), it would help resolve many issues here. DPS not an option - would rather go with PubCoder in that case.
Good luck anyway!

How do I use an Edge Animate project with SVG files in InDesign for DPS output?

Is there any way to include an Edge Animate web content using .svg files in InDesign for output to DPS?
Edge Animate works great with InDesign, except for when you're using SVG files. I've worked with SVG files on the web successfully (writing .htaccess files and such), but it seems like InDesign doesn't like them.
This is pretty important because I don't want to have to design multiple renditions on the DPS suite. Currently I have it setup as a PDF format (DPS) and that scales all of the vector-based type perfectly. It would be wonderful if the animations could also be in a vector format so that when the iPad (3) users see the designs, they will scale naturally through the PDF framework.
Any advice would be invaluable.
Thanks!

moved to the DPS forum....

How to create a menu with pages linked as sub menu in ADF?

Hi Experts,
I'm new to ADF and trying to create a menu like below in ADF.
Actions Menu
|
|
Option 1 -- A page with some static text and links.
Option 2 - A different page with some static text and links.
Have evaluated options like panelGroupLayout and menu components, requesting experts opinion on the best way to do it.
Thanks in advance..

Thanks AP.
Not like outlook. Here's some more details on what I'm looking for.
Create a menu bar.
Create a menu called "Actions"
Create two items under it called "Option1" and "Option2".
When I move the mouse over "Option1", I want a page to be shown on the right (just like how a sub menu will be displayed usually).
When I move the mouse over "Option2", I want to show a different page on the right (just like how a sub menu will be displayed usually).
Thanks in advance.
Edited by: Muruhanantham C on Dec 28, 2012 12:51 PM

Edge Animate, Working with multiple audio tracks

I'm having trouble with one of my animations.
I have set up 8 animated symbols that will play when the user hovers over the symbol.
When the user clicks on a symbol it will play an audio mp3 files.
// insert code for mouse click here
// Sets a toggle to play or pause the audio track
var audio = sym.$("_1")[0]; "_1" is the name of the audio file that is placed on the timeline. The original MP3 file is named 1 but when it was dragged to the canvas it created a layer called "_1".
if (audio.paused) {
audio.play();
} else {
audio.pause();
But there are two problems, one more concerning than the other.
The problems are below:
I can not figure out the code to stop the audio when the symbol is clicked again instead of it being paused. I tried to change audio.pause to audio.stop. That did not help. I would like the audio to stop if clicked again and then play from the beginning if clicked one more time.
This is the one that I am most concerned about. If the user clicks on one symbol, the audio for that symbol will start to play as intended. But if the user clicks on a second symbol, the audio for that symbol will start to play in conjunction with the audio already playing from the previous symbol. It would be nice if a user could click on one symbol it will start to play its audio but if they change their mind and click on another symbol, the playing audio will stop and the new clicked symbol will start to play its audio.
Anyone have any suggestions? Or help to provide. Thanks in advance.

Hi there,
One quick answer to your question, and another that I will follow up on when I get a few minutes.
Animate uses the HTML5 audio API to control audio elements, so you can only use methods and properties that are specified for audio elements in HTML5 browsers.
To "stop" audio, you need to pause it and then set its currentTime property to 0, like so:
sym.$("your_audio_element")[0].pause();
sym.$("your_audio_element")[0].currentTime = 0;
The next time you play this audio element, it will play back from the beginning.
The other part of your question (stopping other playing audio when another symbol audio starts playing) can be done by getting all instances of the audio tag in jQuery and then pausing all audio. I don't have the exact syntax for that at hand as I reply, but I'll respond back with it soon.
hth,
Joe

Play Edge Animate content AFTER Page finishes loading

Is there any way, either in Edge or Muse, to have the edge animations wait until the Muse page finishes loading before starting to play?
thanks

I find no way within Muse to accomplish what you want.
In An you can always just delay the start of your animation(s) for a specificed time.
That may now work very smooth though because everyone's systems will load the pre-animation page at differing speeds.
I'm NOT a js coder but I was looking at some of the generated js code and I have a feeling a good js person could make your animation do what you want.
I see different 'load' perameters mentioned. Maybe one of those could be used.
I'll bet your answer is somewhere in that *_edgePreload.js file.
http://www.lynda.com/home/Player.aspx?lpk4=107145&playChapter=False
That video talks about turning off Auto Play in An and using js for control. It doesn't mention how to do it, just that it can be done.

HOW TO DO VALUE ADOBE EDGE ANIMATE CONNECTED WITH JQUERY FOR DATABASE MYSQL??

Please give me a suggestion...
thank's attention...

Check this link out:
Receiving INPUT TEXT, making Forms from scratch.
The idea is that a symbol is created and the input controls are created or attached to the symbol. For example, we create a rectangle on the stage, convert it to a symbol then name it "username". We can then do the following:
sym.$("username").append('<input/>').attr({ type: 'text', name:'text', value:'text'});
Add the above code in the stage compositionReady event. The above will add a text input control.

Will Edge Animate work nicely with a pre-existing site that already uses some jQuery plugins?

I have a site started and I am using the Quicksand plugin for jQuery that sorts and filters objects on my page, will Edge Animate work with that code, or do I have to do something to keep everything working?
Thanks all!
Aza

Hi jeremy
Thanks for sharing the info. We'll look into this and get back.
Thanks
Manigandan

Lesson for Adobe Edge Animate

Hello Everyone.
OK. Have been doing Edge Lesson's for quite nearly a year now, and wanted to share them with the community.
If you have any request or questions, please feel free to post them to the video links below, or in here, and I will
Try my best to assist you any way that I can.
Edge Animate has really come a long ways, and with the new CC, it has taken on a life of its own.
Look forward to what the future may bring with this awesome Adobe program release.
Wayne Barron
Dark Effects Production
Adding sound to Mouseover event in Adobe Edge Animate
3:42
1
Adobe Edge Animate - Add Sound in Mouseover Event
by darkeffectstv 1,987 viewsIn this video, we will learn how to add sound to a buttons Mouseover event in Adobe Edge Animate.…
Learning how to add sound to Adobe Edge Animate
7:08
2
Adobe Edge Animate Adding Sound to Project
by darkeffectstv 5,031 viewsAdobe Edge Animate Adding Sound to Project…
Remake, as the cursor was not in the last videos.
4:10
3
Adobe Edge Animate - Mirror Text Effects with Wipe On Text (Lesson 3) (Remake)
by darkeffectstv 447 viewsRemake with "Cursor" this time…
Remake, with Cursor
3:49
4
Adobe Edge Animate - Load Background Image (Lesson 3) (remake)
by darkeffectstv 1,050 viewsremake with Cursor, as Cursor was not int he original one.…
2:00
5
Adobe Edge Animate Starting Symbol at certain location
by darkeffectstv 245 viewsIn this quick tip.
We are going to stop a symbol from playing.…
6:53
6
Adobe Edge Animate Animate Logo to show and hide words
by darkeffectstv 418 viewsIn this lesson, we are going to learn how to take an Image (Like a LOGO for a company) and animate it on the screen, and show and hide words.…
5:44
7
Adobe Edge Animate Publish Files and JS Folder
by darkeffectstv 758 viewsIn this lesson, we will guide you through the ins and outs of publishing your site from Adobe Edge Animate, to a web server.…
6:19
8
Adobe Edge Animate Create a Pen and write a Line
by darkeffectstv 527 viewsIn this lesson, we are going to create a Pen, then write 2 lines.
This can be used in so many different projects, that it is endless.…
2:34
9
Adobe Edge Animate Rollover Button
by darkeffectstv 2,195 viewsIn this lesson, I will show you how to code a Rollover Button.
This is a very simple and easy way to create a Rollover Button, with very little effort.…
4:06
10
Adobe Edge Animate show Grid to fine tune your Animation
by darkeffectstv 77 viewsHave a lot of Animation in your project?
In this lesson, we are going to show you how to fine tune your animation down to the 30th of a second…
16:49
11
Adobe Edge Animate Create a Menu
by darkeffectstv 4,993 viewsIn this lesson, we are going to be creating an animated interactive menu, that is sure to grab your users attention.…
12:30
12
Adobe Edge Animate Menu Slide Down
by darkeffectstv 1,175 viewsIn this lesson, we are going to showing you how to create a Sliding Down Menu.
This was really big a few years ago, a lot of sites had these types of menus…
9:45
13
Adobe Edge Animate Menu Slide In from Left
by darkeffectstv 358 viewsIn this lesson, we are going to be creating a cool little menu that will slide in from the left.
I have never seen one like this before, and thought that I would create one, to see if it would work good,…
4:29
14
Adobe Edge Animate Pin and Timeline Indicator
by darkeffectstv 153 viewsIn this lesson, we are going to go over some basics on how to use the Pin and the timeline indicator. This will come in handy, if you have a big project and you wonder what happened, if something messes up …
16:43
15
Adobe Edge Animate Menu Button Header Footer
by darkeffectstv 905 viewsIn this lesson, we are going to be creating a Menu Button, with a Header and Footer.
This is a cool looking button, that will come in handy for some sites.…
12:56
16
Adobe Edge Animate - Shot Bullet from Gun and hit Wall
by darkeffectstv 110 viewsIn this lesson, we are going to be creating a gun, a bullet, a wall.
We are then going to shot the bullet, out of the gun, and destroy the wall.…
7:44
17
Adobe Edge Animate Menu Rollover Buttons
by darkeffectstv 1,047 viewsIn this lesson we are going to create some Rollover Menu Buttons.…
4:11
18
Adobe Edge Animate - Animate Ball Bounce Squish
by darkeffectstv 172 viewsIn this lesson, we are going to animate a ball, of which is going to bounce on the floor, and once it makes contact with the floor, it is going to squish down, just like a real ball will do.…
6:16
19
Adobe Edge Animate - Change Text when Button is clicked
by darkeffectstv 353 viewsIn this lesson, we are going to learn how to change the text of Textfield, when a button is clicked.
reusing the same Text Element over and over again, keeps the project clean and tidy.…
4:02
20
Adobe Edge Animate - Space Demonstration (Lesson coming soon!)
by darkeffectstv 49 viewsThis is a demonstration of a project that I have been working on for the last few days. This will be turned into a lesson, that will be available within the next week or so…
21:37
21
Adobe Edge Animate - Lesson 1 Space Project
by darkeffectstv 87 viewsAdobe Edge Animate space project, showing how to rotate elements around a centered element. Also, how to reuse the same text element over again…
9:32
22
Adobe Edge Animate - lesson 2 Display Planet Information using single text element
by darkeffectstv 61 viewsview lesson #1 first:
http://youtu.be/16GOY1QOD_…
1:39
23
Adobe Edge Animate - Open Link
by darkeffectstv 227 viewsIn this quick how to lesson.
We are going to create a link on Adobe Edge Animate.…
2:31
24
Adobe Edge Animate - Add Sound in MouseOut Event Part II
by darkeffectstv 192 viewsThis is a follow up to a previous lesson.
Please view the following lesson to catch up to what this is all about…
1:28
25

Here are 2 video using "Edge Hero"
Adobe Edge Animate - Edge Hero Lesson 1 - 3d Objects
by darkeffectstv 107 viewsIn this lesson, we are going to be working with a new plugin for Edge Animate called
Edge Hero…
6:55
2
Adobe Edge Animate CC Lesson #2 - Loading Video with Edge Hero
by darkeffectstv 40 viewsIn this lesson, we are going to load some video into our edge project using Edge Her…
And this is the latest video for Edge Animate CC
Adobe Edge Animate CC - Lesson #3 - Animate ball bouncing on boxes and changing colors
http://youtu.be/MxxpQspBpcw

Edge Animate loading jquery twice. External jquery plugin error.

I recently created an interactive map (http://www.lakesofbellaterra.com/Interactive_Map_Demo/Testing/test1.html) using Edge Animate CC 2014.1.1 Release. I used the zoom.min.js plugin from jQuery Zoom to achieve the zooming image effect present when you click on one of the map section and reveal the "section modal". Further more the zoom.js plugin uses jquery 1.7.1. I am deploying this Edge Animate project in a Business Catalyst site using a content holder. Even though the zoom.js plugin works with Internet Explorer 7+ and Firefox I initially was not able to get the zoom.js plugin to work in either browser. After changing the <meta> in the <head> to <meta http-equiv="X-UA-Compatible" content="IE=10,chrome=1"> via suggestion from StackOverflow (internet explorer - What's the difference if <meta http-equiv="X-UA-Compatible" content="IE=edge"> exists or not? - Stac…) I was able to get the zoom image function to work in Internet Explorer 9+. So now I just need to get this function working in the current version of Firefox 35.0.1. As of now when I click on the zoom image nothing happens. The console in firebug reports the following JS related errors:
Using //@ to indicate sourceMappingURL pragmas is deprecated. Use //# instead jquery.min.js:1
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. LOBT-IxD-SectionMap_edge.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery-1.7.1.min.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.easing.1.3.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.zoom-min.js
The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it. jquery.zoom-min.js
Use of getPreventDefault() is deprecated. Use defaultPrevented instead.
After some research I found a lead (WordPress › Support » how to prevent jquery loading twice?) That suggested that Edge Animate may be loading jquery twice, and that may be the source of the errors. I need to find out why this animation is not working in Firefox.
Here is a list of things I have already tried that did not work:
-Changing the utf charset to : <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
-Changing the version of jquery used from 1.7.1 to the latest release of 1.11.2
-Changing the image source referenced in the zoom.js call from a .svg to a .png
-Removing any scripts that may conflict with Edge Animate or zoom.min.js that are being called from within the Business Catalyst page template.
-Running the project outside of Business Cataylst to see if the error persists (it does)
Here a link to the Edge Animate project: Dropbox - LOBT Interactive Section Map
As always any help is determining why Edge Animate projects with a zoom.js plugin do not work in Firefox 35.0.1 would be most appreciated.

Hi jeremy
Thanks for sharing the info. We'll look into this and get back.
Thanks
Manigandan

Edge Animate needs vacation?

How can i work mobile with Edge Animate? Why does Edge Animate start with a blank Screen?

Ok...Sorry! If i work at Home everything is fine! If i try to work with Edge Animate in a open WIFI (Restaurant, University...) i can´t access the Program. It starts with a blank Screen. I can choose "Open" in the Menu...than a blank Stage appears, but it is not possible to change something. If i try to open an existing File the same clear Stage appears.

Responsive scaling of animation in Edge Animate

I am inserting an animation into a responsive web page. I have gotten the design to scale in either direction (horizontally and vertically) in both Animate and a browser but cannot get the animation to scale in both height and width when the browser window size is just narrowed or the page is served up to a mobile device (tablet or phone.) I created a simple test comparison at this link: http://www.users.cloud9.net/~agoltz/edgeTest/animateTest.html I've embedded the CSS styles in the document so they can be evaluated (be kind...I'm an amateur)
If the browser window is narrowed the animation just gets narrower but doesn't scale vertically. The static image scales in both directions as the width of the window or device narrows. I'm looking for the same behavior with the animation. I hope I'm just missing something (not an unusual occurance) and not that this is a limitation of Animate since Flash is no longer a universal option. Any thoughts? Thanks.

Hi Rodlab2x
Thank you for sharing your tests. Interesting to see comparison between Amazium and Bootstrap. Which is which by the way?
I'm impressed, particularly with the first one (http://www.lab2x.com/pacificdental/) because it almost appears to be scale-to-fit in places. In fact, for a moment, you had me fooled and I thought you'd solved it!
I think you've come up with probably the best possible solution at the moment.
Let me just check that I've understood your site correctly?:
You have 3 versions of the header panel that the site swaps to as the browser size is reduced:
1. The large one. This is an Edge Animate animation and uses all the feature in the 'Resize' lesson - ie. it scales horizontally but the height remains the same.
2. The middle one. This is a smaller Edge Animate animation with the same features as above.
3. The small one. (This is the one that fooled me for a moment!). This may be Edge Animate - BUT it's not an animation at all. It is a still image - and therefore able to scale proportionately
Just a suggestion - you could go further and add some animation to the smallest header. If you only use images, not graphics, then you can achieve scaleable animation. Just try making the graphics png files with transparency. Might help if each layer png is the same width and height as the background image. Only issue is - I don't know if the file size will be prohibitively big.
Cheers

Edge Animate and PhoneGap Build

I'm using Edge Animate together with PhoneGap Build to make an iPhone app. There are several buttons that should scroll up and down and yet remain "tap-able" What is the best way to achieve scrolling effect for button?

Not sure if this helps you. I'm going through the same problem. Even raised this issue here in the forum and nobody could help me. So I sought help forum PhoneGapBuild. Looks like PhoneGapBuild not recognize <audio> of html5, so need to use api audio PhoneGapBuild own. Here's a link to my post. Tutorial on how to make by Chris Griffith. I hope this helps you too.
http://community.phonegap.com/nitobi/topics/phonegap_build_audio_and_edge_animate_problem? utm_content=reply_link&utm_medium=email&utm_source=reply_notification&reply[id]=14089620#r eply_14089620

Edge Animate trigger

Is there a way to trigger an Edge Animation with say a rollover, click or rollout?
You can control one with a Parallax scroll effect, so it shouldn't be completely strange to control Edge Animate objects with different States or...?

Yes> add the action to the Edge Animate file/animation itself.

Everytime I open Safari on my MacBook Pro a pop-up window from my Finder menu, with the Applications highlighted on the left in the favorites column with the Resources folder highlighted comes up and locks my Safari page until I manually close the Resourc

Everytime I open Safari on my MacBook Pro a pop-up window from my Finder menu, with the Applications highlighted on the left in the favorites column with the Resources folder highlighted comes up and locks my Safari page until I manually close the Resources window then I have to refresh the internet search address line at the top of Safari. Can someone tell me how to stop this. It started after a software upgrade. It didn’t do that before. Thank you.

A few thoughts for diagnosis/testing purposes:
Have you recently run the disk utility and repaired HD and permissions? If not do so.
Boot into the Safe mode - hold down shift key on boot - and see if the problems are still there. Some functions won't work but see if anything odd happens.
Check your startup items. Get rid of them temporarily.
Create a new user account and see if the problems occur with the new account.
Lastly, be sure your backup is up-to-date.

Edge Animate Menu with Page Highlights

Similar Messages

Maybe you are looking for