Mootools scroll method should call automatically when a method is called

Question

Im new to mootools.So please help me for the problem Im facing.I had a div which consists a href If I click then it will enter into a javascript file and it consists of color method.In that method I kept a script for by usng scroll method.According to my script.If that div is at the top and i click on href it shoud show redcolor and if the scroll is greater than zero then it should show another black color.But what happening is If i scroll down and click it intially it was showing red and it i scroll a bit then it showing black.My code is

  window.addEvent('scroll', function () {
            var scroll = window.getScroll().y;

            if (scroll > 0) {
                black
            } else {
                red
            }

Can I know how to call scroll method as soon as it enter into color method in mootools

Answer 1

That is normal since you invoke the method when the window scrolls and not when you click the button as it will invoke the color method each time you scroll. Each time you click you want to know the updated scroll position not when you scroll the page without clicking the button (hope I understood that well...). And on page load you initially set the background-color to red.

var link = $('link');
var box = $('color-box');
link.addEvent('click', function(event){
  event.preventDefault();
  changeBgColorBox();
});
changeBgColorBox();

function changeBgColorBox () {
var scroll = window.getScroll().y;
  if (scroll > 0) {
    box.setStyle('background','black');
  } else {
    box.setStyle('background','red');
  }
}

Here is a jsfiddle: http://jsfiddle.net/Bwv3S/40/

To invoke the method only when you scroll the page you would not need to invoke the method with the link being clicked at all. You would invoke the method onload or ondomready and onscroll. http://jsfiddle.net/jLPpa/9/