i think you can put the onload function in the <head> element and that'll get rid of the flicker problem
i.e. instead of this in the body <script> window.onload = function() { new Effect.Appear('entryimage',{duration: 4.0, from: 0.0, to: 1.0}) } </script> you can do <head onload="new Effect.Appear('entryimage',{duration: 4.0, from: 0.0, to: 1.0})"> blah blah blah </head> On Mon, Mar 31, 2008 at 8:04 PM, HomeAutoM8 <[EMAIL PROTECTED]> wrote: > > ================================================= > Mon-03-31-2008, 11:04pm U.S.EDT > > Hello, > I'm trying to get a website entry page to work properly, while > learning Scriptaculous effects and javascript at the same time. I > wanted to use a couple of effects to add a little flash-style > animation. I managed to get the initial Appear to work but with a > problem: the image that's supposed to fade in flashes quickly for > about 1/10 of a second, then proceeds to appear slowly as intended. > > Goal: > --1---- Basically the page is supposed to open w/black background > (CSS) and a small 135x102px display of a larger image file which > appears gradually (Effect.Appear). > --2---- There is a link established between the image and the site's > main homepage, there is also a link established between the phrase > "CLICK TO ENTER" and the same main homepage. > --3---- When a visitor(s) clicks on the image or the phrase, the > image enlarges (Effect.Scale) on the screen to five times its original > display size, then slowly fades away (Effect.Fade),then they are > redirected to the homepage.These 2 effects run in series and the link > takes effect before the effects finish. > --4---- In case javascript is not browser-enabled, the link will still > be made if for any reason the effects don't work or do not complete > their procedure. > > I'm a newbie at this, but have antied up with 30-40 hours of web > tutorials, advice forums, library books (incl: Prototype & > Scriptaculous In Action) plus lots and lots of trial and error with > this page's code, and a little banging my head against the wall. I > hoping the solution is easier than the drywall dent repairs next to my > computer. I understand the javascript concepts (I think) but most of > the info I've seen does not include the Scriptaculous effects actually > inserted into a page's XHTML code with external links (demo pages just > lead to "#"). Tutorials/books show what parameters/options are > available. Some of the basics==like whether the <script> goes before > the DIV its controling or after it, or in the pages <head> and not in > the <body>==are probably too simple to include in the tutorials with > the assumption that one already knows those coding strategies. > > I'm hoping to learn how easy it is to use these cool effects. Thanks- > in-advance for any ideas or solutions... and being patient with such > elementary questions, > > HomeAutoM8 > > PS: sorry for such a long post, I just think more info/details is > better than less. > > The page's code is appended below > ======================================================== > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> > > <head> > <title>TESTENTRYPAGE</title> > <meta http-equiv="content-type" content="text/html; charset=utf-8" /> > > <script type="text/javascript" > src="taculousjavascripts/prototype.js"> > </script> > > <script type="text/javascript" > src="taculousjavascripts/scriptaculous.js?load=effects"> > </script> > > <link rel="stylesheet" href="CSS/websitestylesheet.css" /> > > <script> > window.onload = function() > { > new Effect.Appear('entryimage',{duration: 4.0, from: 0.0, to: 1.0}) > } > </script> > </head> > > <body> > <p><p><p><p><p><p> > <center> > <div id="entryimage"> > <a href="homepage.html"><img style=" > float: none; > border-style: none; > width="135" > height="102" > src="images/Explosion1026x770x180.jpg" > alt="Please Click To Enter"/> > > <center> > <a href="homepage.html" > style=" > font-weight: bold; > text-decoration: none; > font-size: .50em; > color: #E9B9B1; > a hover: #FF0000; > " > >CLICK TO ENTER</a> > </div> > > <script> > <a href="homepage.html" onclick="new Effect.Scale( 'entryimage', 500, > { scaleFromCenter: true }); return false;"></a> > </script> > > </body> > </html> > > ======================================================== > > > --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs@googlegroups.com To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---