Javascript 增加MooTools中的左边距
我想增加左边缘的-190px,每次点击最多6次。我现在有Javascript 增加MooTools中的左边距,javascript,mootools,Javascript,Mootools,我想增加左边缘的-190px,每次点击最多6次。我现在有 $$('#goright').addEvent('click', function(){ $$('#buttons').tween('marginLeft', -190); }) 但这只会发射一次。我需要在每次单击时运行(jQuery将使用类似++),然后最多运行6次(我假设这也将使用类似
$$('#goright').addEvent('click', function(){
$$('#buttons').tween('marginLeft', -190);
})
但这只会发射一次。我需要在每次单击时运行(jQuery将使用类似++),然后最多运行6次(我假设这也将使用类似<6的内容)
有什么帮助吗?这是一种方法。基本上创建一个全局变量计数,每次递增1。点击,甚至基本上检查点击是否小于6,如果是,抓住所有的按钮,在它们上做一个循环,然后分别在它们之间。诀窍是获取当前el的左边距样式,然后将其转换为int,以便删除
px
,然后根据元素的左边距的位置进行加减。这里是演示它的实际效果,但是我没有使用-190,而是使用+10,这样你就可以看到效果了。请让我知道这是否是你要找的。顺便说一下,这是使用Mootools core 1.3完全兼容:
var count = 0;
$('goright').addEvent('click', function(){
if(count < 6){
$$('.btn').each(function(el){
el.tween('margin-left', el.getStyle('margin-left').toInt()-190);
});
}
count++;
});
var计数=0;
$('goright')。addEvent('click',function(){
如果(计数<6){
$$('.btn')。每个(函数(el){
el.tween('margin-left',el.getStyle('margin-left').toInt()-190);
});
}
计数++;
});
我使用的HTML:
<button class='btn'>1</button>
<button class='btn'>2</button>
<button class='btn'>3</button>
<button class='btn'>4</button>
<div id='goright'>Click To Go Right</div>
1
2.
3.
4.
点击右转
实际上,这是一件很有趣的事情!如果您可以更多地使用MooTools,那么就有可能定义伪事件。事件,它们在执行后对自己“做点什么”。因此,您将使用myEl.addEvent('click',fn')而不是myEl.addEvent('click:one',fn)
。在MooTools中,:一旦定义了,它将触发一次,然后解除连接,这意味着,在第二次单击myEl
后,将不会发生任何事情(EventListener已解除连接)
我创建了一个:times(n)
伪事件,没什么大不了的,但它清楚地说明了如何使用这些所谓的伪事件。这是一本书
也许这可以帮助你或其他人
干杯,快乐编码