-
1. Re: Customising Preloader
Hi there,
Try utilizing the steps in this thread to change the background color from being white to being the default color of your animation:
http://forums.adobe.com/message/4300575
Also, are you sure you have made the x and y values percentage in the Preloader settings? It needs to be set in the preloader settings, not just the Stage settings.
Let me know if that helps! Thanks!
-Devon
-
2. Re: Customising Preloader
Hi and thanks for your reply!
Yes, I have made X and Y values percentage in Preloader settings - X works fine since preloader animation is centered horizontally, however, Y doesn't seems to work since animation is stuck at the top of the page.
Stage is set at 100% for both X and Y - so I have no idea what's the problem.
I'll try to follow that thread in regards to background colour and report back
-
3. Re: Customising Preloader
One more thing I am tottaly confused about...
3. What on earth is the difference between 'Imediate' and 'Polite' preloader options!?!?!
-
4. Re: Customising Preloader
Update:
I checked that thread and it makes no sense whatsoever...
Maybe since it is almost 1 year old and is dealing with Edge preview while I am using V1.5
In any case, I have checked edge.min.js from edge_includes folder as well as index_edge.js from the root and both files do NOT include string thread is talking about.
Any other suggestion!? -
-
6. Re: Customising Preloader
Hmmmm...
So no one can help with this!?
OK
How about forgeting built in Edge Animate preloader and creating one independently!?
Can anyone help with this?
All I want really is simple site preloader that will center animation in the middle of the 100% wide and high stage and that would allow me to use different coloured or patterned backgrounds instead of plain white as offered by Edge Animate.
-
7. Re: Customising Preloader
I found this for u... I tried it and it works...
I didn't create the solution... I'm just bringing it to u...
If you have a preloader the preloader will not center using the above method.
You will need to use this method:
Open the HTML file created by Edge...
Using Dreamweaver or Notepad
add this in between the <head> tags:
<style type="text/css">
<!--
#Stage {
height: 596px;
width: 553px;
margin-right: auto;
margin-left: auto;
}
-->
</style>
Make sure the height and width match the height and width that you set for the Stage in Edge.
-
8. Re: Customising Preloader
Hi and thanks for the post but that doesn't help...
1st - I am using 'liquid layout', or in other words, 100% wide and high stage. So my main stage is NOT of fixed dimension.
2nd - Preloader animation is centering fine down X coordinates but it isn't centering down Y coordinates. In other words, vertical centering isn't working while horizontal is fine...
3rd - Project I am working on is tonaly rather dark (on the dark background) so having preloader on white background makes no sense at all. I wish to be able to customise Edge Animate preloader to properly reflect rest of the design ie. change background colour of it and ideally, instead of using plain colour, load bitmap pattern instead.
So yes..
Still looking for a help!
-
-
10. Re: Customising Preloader
No help from Adobe...
No help from users...
It appears that Adobe Edge Animate built in preloader - MUST have white background and it DOES NOT play well with 100% wide and high stage - officially! (???)
Sad stuff
-
11. Re: Customising Preloader
Hi,
if I understood you correctly then you are looking to change the appearence of the preloader.
In my case I did just copy (cmd+c) from my main stage a bg-image and placed it (cmd+v) under the Elements tab below the preloader div. I hope that that might solved you issue.
Best, J
-
12. Re: Customising Preloader
Hi,
Thanks for the post but that is not the solution...
I am using fluid / resizable stage - NOT of the fixed size!
In other words, I need to figure out how to place tilable pattern behind preloader animation, NOT an image of fixed widht and height.
2nd problem is how do I center preloader animation in the middle of the screen regardless of its size and shape?
For some reason, when you are using fluid stage, preloader animation centers fine horizontaly but it does NOT center vertically and instead it gets 'stuck' at the top of the screen (Y axis)
I am kind of getting desperate and loosing hope with this one...
-
13. Re: Customising Preloader
Hi,
I assume that your preloader panel has objects. What are their names? You have to look at the Elements panel.
-
14. Re: Customising Preloader
I don't understand...
From the main stage I can click on EDIT button under Preloader section (just right from Polite or Imediate options)
When I eneter Preloader Panel there is almost nothing that I can do there...
I can insert preloader clip-art and that is about it...
Under Elements panel there is only one item - loader-bar!
How can I change background colour?
How can I center preloader bar if my main stage / project is utilising 100% width and height (fluid stage)?
Joel, if you could help, I would be extremly greatful!
-
-
-
17. Re: Customising Preloader
Hi,
I do not have enough time to write a demo. Could you send me your project in a private message?
-
19. Re: Customising Preloader
Here is one solution.
I rewrite the html file.
<body style="margin:0;padding:0;height:100%;background-image:url(back2.jpg);">
<div id="container" style="margin:0;padding:0;height:100%;background: url(images/loader-bar.gif) no-repeat center center;">
<div id="Stage" class="EDGE-19258028">
...
</div>
</body>
So, you use the Edge file without preloader.
-
20. Re: Customising Preloader
Amazing
So why Edge Animate preloader isn't designed to apply such simple changes to index html file!?!?
wow
Thank you so much!
I haven't really played too much with it but from what I can see all is working exactly as I wished!
One thing that I am kind of confused about now is - what exactly such solution is preloading really!?!?!
Is this solution still preloading EVERYTHING that is under ASSETS tag in Edge Animate?
Thank you again so much - you are star!
-
-
22. Re: Customising Preloader
Hi all,
I was just playing with this solution a bit more and I can confirm great news!
1. Visually - it is all working perfectly, preloader animationg / graphics are centering on the screen on fluid layout.
2. It is indeed super easy to change background colour or indeed add bitmap pattern.
3. Most importantly this solution DOES preload all the files found under Assets tab in Edge Animate!
In short - Joel Pau did it again
Thank you again!
@Elaine
This simple preloader customisation option(s) are simply must feature in the next incarnation of EA - in my humble opinion that is.
Fingers crossed it finds it way for the next release.
Thanks for taking a notice!
All the best!
-
23. Re: Customising Preloader
Hi Devon,
Is there a way to access to this post (unauthorized) about changing the background color of a preloader ? Thanks
Gil
-
24. Re: Customising Preloader
Hey, Gil-
I moved the post over to the Edge Animate forum from the prerelease forum, so it should be accessible now.
Thanks,
-Elaine
-
-
26. Re: Customising Preloader
joel_pau wrote:
Here is one solution.
I rewrite the html file.
<body style="margin:0;padding:0;height:100%;background-image:url(back2.jpg);">
<div id="container" style="margin:0;padding:0;height:100%;background: url(images/loader-bar.gif) no-repeat center center;">
<div id="Stage" class="EDGE-19258028">
...
</div>
</body>
So, you use the Edge file without preloader.
I know i'm a bit late to the party but i needed to figure this out also.
changing it in the html file directly does work.
However i felt there should be an easier way not to make more work for myself
to help change the preloader body background color
I use this:
$("body").css("background","rgba(0,0,0,1.00)");
inside the OpenActions on the Preloader itself.
hopefully this becomes useful for the next person who stumbles across an old post.
trying to find an alternative solution
fyi I don't post much so... if my etiquette is off sorry.
-
27. Re: Customising Preloader
i solved it by adding $("body").css("background","black"); to the preloader actions, while editing the preloader, not to the stage's actions, cause they won't effect the preloader's page itself.
Adding <body style="margin:0;padding:0;background-color:black;"> to the html file, as the body tag opening is the only way to make it work.
<body style="margin:0;padding:0;background-color:black;">
<div id="Stage" class="EDGE-Number">
</div>
</body>
-
28. Re: Customising Preloader
Yes, I prefer to use Preloader.loading event for this.
$("body").css("background","rgba(0,0,0,1.00)");
$("body").css("width", "100%");
$("body").css("height", "100%");
-
29. Re: Customising Preloader
But, without modifying html file, is possible center elements with preloader in Edge? I have a animated .gif in preloader panel, but I can't use sym.$("intro").css in Prelaoder.loading because Stage doesn't exists yet, how can I center image in preloader? if I use 50% in x and y, then the position 0,0 of image is centered, but not center of image.
