Hi!
I have very simple submenu hover fx - similar to mootools 1.1
Fx.Styles demo page:
window.addEvent('domready', function(){
// SUBDIR HOVER FX
var list = $$('li.subDir a');
list.each(function(element) {
var fx = new Fx.Styles(element, {
duration:120,
transition: Fx.Transitions.Cubic.easeInOut,
wait:false
});
element.addEvent('mouseenter', function(){
fx.start({
'right': 15,
'color': '#000',
'border-color': '#888',
'background-color': '#e4e4e4'
});
});
element.addEvent('mouseleave', function(){
fx.start({
'right': 0,
'color': '#ff6600',
'border-color': '#333',
'background-color': '#111'
});
});
});
// SUBOBJ HOVER FX
var list = $$('li.subObj a');
list.each(function(element) {
var fx = new Fx.Styles(element, {
duration:120,
transition: Fx.Transitions.Cubic.easeInOut,
wait:false
});
element.addEvent('mouseenter', function(){
fx.start({
'right': 15,
'color': '#000',
'border-color': '#888',
'background-color': '#e4e4e4'
});
});
element.addEvent('mouseleave', function(){
fx.start({
'right': 0,
'color': '#e4e4e4',
'border-color': '#333',
'background-color': '#000'
});
});
});
});
Demo page: http://demo3.blowback.fi/hakukoneoptimointi
Script runs smoothly on Firefox, Opera and IE6 but fails totally under
IE7. My script looks almost indentical to the one that is documented
in Mootools demo page witch works fine on both IE's. I can't see
what's ruining this one.. Any help would be much appreciated!
