Scriptaculous effects new help

I have been experimenting with the scriptaculous effects and can get them working with a click as shown below:

<a id="blink" style="cursor: pointer;" onclick = "new Effect.Highlight('fun', {duration: 2});">Flash</a>

but I want the effect to happen when the page loads but I have no idea how to do this can anyone help?

Well, fortunately, it is rather simple. Javascript is all about listening to and binding to events. Right now in the code:

<a id="blink" style="cursor: pointer;" onclick = "new Effect.Highlight('fun', {duration: 2});">Flash</a>

you are binding to the click event so that when the click event fires you launch the highlight action.

You can just as easily bind to other events such as the page loading. Currently, you are binding to the event inline meaning that the "onclick" is being specified within the button.

I am an advocate of unobtrusive javascript when possible and you can also bind to events through an unobtrusive method. That would be putting the following in the application.js file in /public/javascripts:

$('blink).observe('click', function() {    new Effect.Highlight('fun', {duration: 2}); });

and then in the html:

<a id="blink" style="cursor: pointer;">Flash</a>

Using this method, putting it on the page load is as simple as changing the event being observed:

Event.observe(window, 'load', function() {    new Effect.Highlight('fun', {duration: 2}); });