Animate a banner

Hello

I downloaded the demo of muse to adobe and I am trying to create my first website.

I want to create a modern home page: when it opens I want it to be animated.

The home page consists of a photo and a banner. At the beginning the banner is located in the middle of the page and I want her to be animated so that I'll go to the top of the page.

Then, a menu is displayed in the banner.

How can I do?

Here are a few screen to make it easier to understand.

Thank you

Marco

Schermata 2014-08-18 alle 20.26.45.pngSchermata 2014-08-18 alle 20.27.01.png

Schermata 2014-08-18 alle 20.27.22.png

Hi creativefxs,

This can be achieved using Adobe Edge animate. You can create the animation using the edge animate and then add the same to Muse.

To learn more about Edge animate, you can consult the following link:

Edge animate CC tutorials | Discover how to use Edge animate CC

To integrate the edge animate and Muse, please see:

Integration of graphics Adobe Edge animate | Learn Adobe Muse CC | Adobe TV

Concerning

Sonam

Tags: Adobe Muse

Similar Questions

  • How to make an AdWords ad in animate CC

    Hello

    I am trying to create a banner for AdWords and since I lack of programming skills is very confusing. When I export the created banner in AdWords animate won't accept it. Is it possible to create for adwords?

    Adobe animate HTML5 banner ad for Google AdWords

    1. combine in spritesheets uncheck in the publication settings because JSON file that is created is not allowed.

    2 uncheck hosted libraries in the publication settings to advance tab because the library CreateJS must be included in the ZIP (compressed in ZIP is only 48 KB).
    If you need more space you can refer to two libs and include the two other libs


    3 include the tag meta format ad banner size in thetag in your index.html file.

    For example:

    4. HTML5 banner ad for Google AdWords is, by default, clickable on the entire surface of the sequence.

    You don't need to include any code "clickTAG".

    5 ZIP file (Adobe Web animate HTML5) must be 150 KB or smaller.

    6 check Adobe animate banner ad (ZIP file) for Google AdWords HTML5: https://h5validator.appspot.com/adwords

  • Adobe animate HTMl5 google "clickTAG" button

    I hope somewhere can help me as its very urgent, I have this fixed number.

    I just have to animate a banner using Adobe, I need to add a button (clicktag) clicks

    Can someone tell me how to do this?

    At the moment I have a clip called "movieClip_1".

    I gave it an action I have copy and paste.

    ------------------------------------------------------------------------------------------------------------------------------------------------------

    this.movieClip_1.addEventListener ("click", fl_MouseClickHandler_2.bind (this));


    function fl_MouseClickHandler_2()

    {

    Start your custom code

    This code example displays the words 'mouse clicked' in the output panel.

    "clickTAG" = window.location.search.substring (1) .split ("clickTag =") [1];

    Window.Open (clickTAG);

    Complete your custom code

    }

    ------------------------------------------------------------------------------------------------------------------------------------------------------

    It almost works, but the problem is that when I click the button, it opens several tabs instead of only 1.

    I also get this warning by publishing

    In EaselJS frame numbers start at 0 instead of 1. For example, this STOP button and gotoAndPlay calls. (10)

    Happy with the two Bitmaps and buttons can generate errors of local security in some browsers to run from the local file system.

    Google AdWords

    Option 1:

    HTML5 ads are, by default, clickable on the entire surface of the announcement.

    Option 2:

    If you want to limit the clickable area for specific items, you will need to include the exitapi.js script.

    To use exitapi.js, include the following script in your HTML pageTag:

    In Animate create transparent button and give the name of the instance, for example cta
    Then open the action and place the code:

    This.CTA.on ("click", function() {}

    ExitApi.exit ();

    });

    In the end, you can test ad on link: AdWords | HTML5 Validator

    ------------------------------------------------------------------------------------------ ---------------------------------------------

    Google DCM (campaign manager of DoubleClick)

    include the following in your HTML page scriptTag:

    In Animate create transparent button and give the name of the instance, for example , CTA
    Then open the action and place the code:

    This.CTA.on ("click", function() {}

    Window.Open (clickTag, "_blank");

    });

    In the end, you can test ad on link: Campaign Manager for DoubleClick | HTML5 Validator

  • Have problems with the insertion of a hyperlink in my flash with Adobe Flash CC banner

    Hi all

    have the following problem: you create a file, .fla with Adobe Flash CC (banner, consisting of six sequenced images). I want to insert a link, but does not work the clickin. What code AS3, I have to insert, if the banner is called "banner" and the link is http://www.adobe.com? (I need to another link, just for example)? I need to click on the pictures that follow after another to come on the site I want to connect it.

    Many thanks in advance,

    Kind regards

    Ruth

    How did you assign the name of the instance to the banner?  Instance names are assigned by selecting the object on the stage, and then by entering the name in the properties panel where it says .   If you happen to animate the banner before the framework where you assign the code itself, you must assign the name of all previous key frames, where the object of the banner is as well.

  • How to add multiple clickTags HTML5 Banner in Animate

    Hello

    Is it possible to add several "clickTAG" to a banner of HTMl5 in Animate?

    Yes, first of all, in Animate create multiple buttons with instance different names for example btn1, btn2, btn2... and write code in the actions, for example:

    This.Btn1.on ("click", function () {}

    Window.Open (window.clickTag1, '_blank')

    });

    This.btn2.on ("click", function () {}

    Window.Open (window.clickTag2, '_blank')

    });

    This.btn3.on ("click", function () {}

    Window.Open (window.clickTag3, '_blank')

    });

    Second, write HTML code for example:

  • Banner reactive in CC Animate

    Hey Adobe,

    Can you explain how to use the new "adaptable" feature in Adobe animate CC?

    We try to make a banner of anglo-saxon reagent (938 x 340) that can resize a rectangle (320 x 340) in width, but we do not know how.

    Our sensitive issues:
    1. How can put us across the components/movieclips when resizing the browser? For example: make the text in the smaller display panel when you resize it to a rectangle format.
    2. How can we put the movieclip in the center of the stage and the scale a bit when resizing the browser? For example: the background image.
    3. How can we keep a movieclip around when resizing the browser? For example: customers logo

    Articles, we've found so far:

    Edge animate animate CC: reactive resizing and positioning - red-handed!  The file provided is scaling of the whole Web instead of several clips/items
    Documents to create HTML5 Canvas to animate CC  Article that explains what can do the function
    Animate CC 15.2 release (June): Express more with less | Adobe content corner Article says that it is possible and presents two photos of a canvas in several
    devices of)
    https://www.publishingblog.ch/responsive-exportieren-in-animate-CC/  German article explaining a bit about the feature


    Attach files in .fla made CC animate or tutorials on the use of this feature. would be a great help.

    Thank you!

    Michael

    Hi Michael,

    The feature to "sensitive" to Animate is still limited and work so that your entire canvas/stage adjusts its size according to the size of the browser of the Viewer. It also maintains the original aspect ratio while doing so.

    There is no option to scale selectively only a few elements; the scale is applied to the entire scene and everything together.

    For this reason, a specific angle or anchor Center element is irrelevant here that the relative positions of all elements proportional rest.

    To use sensitive scaling functionality in Animate, no changes do not impose themselves on the stage, simply activate the option via the publication settings.

    Essentially two types of scaling is followed - one maintains that the scale, another original aspect ratio can evolve into mode full screen regardless of the aspect ratio.

    The options you are looking for do not currently exist in Animate and need to be addressed via scripts only.

  • Using Adobe animate for a banner in loop 3 times

    In the afternoon, all the


    I started using Adobe animate this week. I've created a banner simple online that needs a loop 3 times and then stops. I use a HTML5 canvas as it's supposed to be published on HTML5 like everything these days!


    I added the AS3 code that I used once on a Flash AS3 file, but it does not work. Can someone help me with a simple piece of code that actually works. Maybe I'm not supposed to use AS3 code on a HTML5 canvas - I don't really know what to do! Help, please.


    Thank you

    put this question to the last frame of your

    {if(!this.alreadyExecuted)}

    this.alreadyExecuted = true;

    this.loopNum = 1;

    } else {}

    this.loopNum ++;

    {if(this.loopNum==3)}

    This.Stop ();

    }

    }

  • How to share banner edge animate in the portfolio online?

    I would like to include examples of banner ads created in Edge animate. I did research online but have not yet succeeded. Someone managed to solve this problem?

    Thus, 2 tools can be used:

    (1) edge API. You must customize an html page ==> API JavaScript Adobe Edge animate CC

    (2) common edge. You have a tutorial here ==> nesting animate compositions with the joint Composition by Edge magazine | EdgeDocks.com

  • I created an animated banner 468 x 60 in edge animate. How to save the image hosted on my desk? (not in HTML)

    I created an animated banner 468 x 60 in edge animate. How to save the image hosted on my desk? (not in HTML)

    Hello

    This feature is not available in Adobe Edge animate. You cannot export as image of the animate edge.

    Publish here describe the options available on board

    M lively help | Publish your content

    Kind regards

    Devendra

  • How is insertar UN banner hecho con Edge you can animate en Joomla?

    Client UN me ha pasado una con vidéoconférence banner made in Adobe Edge, con UN known html y archivos .js... how en Joomla of ESE puedo put banner?

    xantir y Jorge -.

    El don't format OAM no compatible con are Joomla, pero is insertar una composición can animate using an iframe.  SE needs to change Joomla an aceptar HTML:

    http://docs.Joomla.org/Entering_raw_HTML_in_editors

    Después, to add the page you can:

    We have an example del iframe "Floral Match Maker" in el example here:

    http://HTML.Adobe.com/edge/animate/showcase.html

    Saludos,

    -Elaine

  • How to create a banner size mouseover who starts running only at the end (in Adobe Edge animate)

    A banner general practice is to have the entire banner be clickable as well that trigger the mouseover and mouseout/mouseouthandler().

    In flash, you would do an invisible button that captured the events, and then looks like an internal chronology of a chart of the CTA to play and which would scale upward.  I would also (in the main scenario where all the basic animation) a fade in opacity to the top of the CTA at the end Flash would allow me to set the rollover and rollout on the last image, so no features a rolling code would execute while the button was in invisible state.

    Along the busy, I know how a symbol, with an internal chronology which can evolve the assets. I know how to use the action of another layer to speak to this chronology of symbols and to play and to reverse the trend.

    But I can't understand how the mouseover and mouseout/mouseouthandler() code to run ONLY when the banner has played through the main timeline animation.

    Thank you.

    make a layer/button which is at the top with a transparent png of the size of your project. First frame of the main timeline, the value to display last image off the coast, it appears on the value.

  • How do I would broadcast an advertising banner created on board animate on a publication?

    Hello. New Edge animate and very enthusiastic about its use. How would distribute the files/folders to a publication? I would send them the "index.html" file + support files created when published?

    Click file > publish and then click Web and then publish, it will generate a publication/web/folder, which is a version optimized composition, you can distribute.

    HTH,

    Vivekuma

  • HTML5 banner disappears after playing

    I created this banner of HTML5 in Adobe animate, using the method set out by Cory Hudson who uses AdHelper and CreateJS.

    I was not able to reproduce the bug, but apparently, sometimes after he plays, it is empty. The only things to stay are sometimes the main lines and a tiny "t" with a broken image icon. He normally played first and may take minutes before it is not empty. What is happening on 10.11.6/Safari Mac OS 10.0 and Windows 7 / "Chrome later."

    From messages on apparently similar problems, I tried a few things. I went from the use of sprites to individual image files. That did not help. In this version, I tried to comment on this line of code: .setSleep(15,0,0) . I don't know if that did the trick well.

    Can someone reproduce the bug? If so, working my dose? Any ideas on what I am doing wrong? Thank you!

    Don't know what the cause of the bug (I can't reproduce on my end) but one thing to note is that you are using outdated models.

    If you are using the latest version of Animate, try to use these newer models and see if that solves your problem: creating HTML5 ads with CC animate: Google HTML5 Ad Templates | Blog hosting the Adobe team

    You don't need to use AdHelper, unless you really want to, and certainly you need not TweenMax reference in your HTML file as you use just the scenario animation.

  • Download Adobe animate HTML & JS to googleads - ads will not animate?

    Hello

    I'm uploading my Adobe publication animate creative Google AdWords, I have never done this before.

    I have in my zip file HTML, javascript and image so everything should be good to go. However when I download and preview, it is not an animation. It's just the static background image. I'm doing something wrong with my code? Should I do something different with my publishing settings to animate? Has anyone else encountered this when you try to put an advertisement hosted on Adwords?

    Thanks in advance for your help.

    GSAP created a forum banner when news of Google Chrome came out last summer. Very experienced people.

    Banner Animation - GreenSock

  • Animate with greensock, text effect

    Hello, I am trying to build banner in Adobe animate with greensock.

    I do positioning to animate it and after that I do everything with the code in the first block of the timeline...

    Most of the transitions are with Y year X (left, right, tilt, rotation, low and high), opacity with alpha as well as certain triggers that make smoother.

    (is there a list of other commands that can be used in the workaround?)

    I want to make the text in a kind of effect... type each letter after another, what can we bij animate and/or greensock?

    I saw a plugin of breath, but I don't know how to use that in the lively...

    Maybe someone has some issue or perhaps answer?

    Welcome marcel

    To animate text in Adobe animate, if you use fonts custom, your best bet is to divide your text twice, convert each letter to a movie clip symbol, distribute video clips of layers and animate each of them with their own tween.

    If you just want they appear one by one, without any sort of bland or movement, you can skip breaking apart each letter in video clips, keep the text on one layer and reveal it with a mask instead: How to use layers of mask in Adobe animate CC

    If you use a dynamic text, there would be other ways to reveal with the code, but I'm assuming that you are using the static text because I know how customers love their custom fonts.

    Alternatively, if you're comfortable working outdoors to animate, for text effects of animation with Greensock... impressive the plugin SplitText is amazing for DOM elements if you use web fonts for your project: GreenSock | SplitText (Please note that this will not work in Animate, that uses the canvas).

Maybe you are looking for