Hello everybody,
iam a newbie in mootools programming.
Iam trying to build a scroll wirth link to auto add new divs in the
scroll. Its working except when i built a new link, i cannot add a new
event on it ...
There is my code:
window.addEvent('domready', function() {
var scroll = new Fx.Scroll('demo-wrapper', {
wait: false,
duration: 1500,
offset: {'x': 0, 'y': 0},
transition: Fx.Transitions.Quad.easeInOut
});
var clicks=2; //counter to keep track of clicks
$('newStep').addEvent('click', function(e) {
new Event(e).stop;
var newDivText="STEP "+ clicks+" / ";
var step_title;
step_title="step_title"+ clicks;
var content;
content="content"+ clicks;
var oldcontent;
var oldclicks = clicks - 1;
oldcontent="content"+ oldclicks;
//Add a new div in the scroll div
var newDiv=new Element('div', {
'id': content,
'class': 'scrolling-content'
}).setText(newDivText).injectAfter(oldcontent);
//Add a new link to command the scroll
var myAnchor = new Element('a', {
'href': '#content'+ clicks,
'id': 'link'+ clicks,
'events': {
'click': function(){
scroll.toElement('content'+ clicks);
}
}
}).setText(newDivText).inject('demo-bar', 'top');
clicks++;
});
});
</script>
<body>
<div id="conteneur"> <a href="#" id="newStep">Add a new Step >></a>
<div id="demo-bar"> </div>
<div id="demo-wrapper">
<div id="demo-inner">
<div id="content1" class="scrolling-content">
<h1>The Blue Sky</h1>
</div>
</div>
</div>
</div>
</body>
The problem is here :
scroll.toElement('content'+ clicks);
I tried to add an event to the link with this code without result
$('link'+ clicks)).addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content'+ clicks));
});
thanks in advance
NC
