Comments on: Create Snook-Style Navigation Using MooTools http://davidwalsh.name/snook-navigation-mootools Legendary scribbles about JavaScript, HTML5, AJAX, PHP, CSS, and ∞. Thu, 09 Feb 2012 10:59:12 +0000 hourly 1 http://wordpress.org/?v=3.3 By: Marekhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-26178 Marek Fri, 22 Jul 2011 09:44:56 +0000 http://davidwalsh.name/?p=1647#comment-26178 window.addEvent('domready', function(){ var list_a = $$('#menu ul li a'); list_a.each(function(element) { var fx = new Fx.Styles(element, {duration: 900, wait: false, transition: Fx.Transitions.Sine.easeIn}); element.addEvent('mouseenter', function(){ fx.start({ 'background-position': ['-457px 1px', '0px 1px'] }); }); element.addEvent('mouseleave', function(){ fx.start({ 'background-position': ['0px 1px', '-457px 1px'] }); }); }); }); window.addEvent(‘domready’, function(){
var list_a = $$(‘#menu ul li a’);
list_a.each(function(element) {
var fx = new Fx.Styles(element, {duration: 900, wait: false, transition: Fx.Transitions.Sine.easeIn});
element.addEvent(‘mouseenter’, function(){
fx.start({
‘background-position’: ['-457px 1px', '0px 1px']
});
});
element.addEvent(‘mouseleave’, function(){
fx.start({
‘background-position’: ['0px 1px', '-457px 1px']
});
});
});
});

]]> By: Marekhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-26176 Marek Fri, 22 Jul 2011 09:42:44 +0000 http://davidwalsh.name/?p=1647#comment-26176 Sorry the code:<code> // </code> Sorry the code:


//

]]> By: Marekhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-26175 Marek Fri, 22 Jul 2011 09:40:56 +0000 http://davidwalsh.name/?p=1647#comment-26175 Hi Roark,thanks for this script you really saved my life :-). I had to changed it a little as I had to use horizontal background movement instead. Just in case if anyone will need it here it is://Works fine in older MS IE !!!Great thanks again!!!br Marek Hi Roark,

thanks for this script you really saved my life :-). I had to changed it a little as I had to use horizontal background movement instead.
Just in case if anyone will need it here it is:

//

Works fine in older MS IE !!!

Great thanks again!!!

br
Marek

]]> By: Sureshhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-24499 Suresh Fri, 24 Jun 2011 06:11:28 +0000 http://davidwalsh.name/?p=1647#comment-24499 Very nice thanx Very nice thanx

]]> By: linebluhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-21460 lineblu Tue, 30 Nov 2010 13:41:51 +0000 http://davidwalsh.name/?p=1647#comment-21460 The solution for the active menu element: <code> if(!el.hasClass('current')) { el.setStyle('background-position','-20px 35px').addEvents({ 'mouseenter': function(e) { e.stop(); el.setStyle('color', '#FFD700'); fx.start('background-position','-20px 94px'); }, 'mouseleave': function(e) { e.stop(); fx.start('background-position','-20px 35px'); el.setStyle('color', '#000000'); } }); } </code> The solution for the active menu element:

if(!el.hasClass('current')) {
el.setStyle('background-position','-20px 35px').addEvents({
'mouseenter': function(e) {
e.stop();
el.setStyle('color', '#FFD700');
fx.start('background-position','-20px 94px');
},
'mouseleave': function(e) {
e.stop();
fx.start('background-position','-20px 35px');
el.setStyle('color', '#000000');
}
});
}

]]> By: linebluhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-21457 lineblu Tue, 30 Nov 2010 11:11:36 +0000 http://davidwalsh.name/?p=1647#comment-21457 Hi David,is there no solution for an active state of a navigation element. You have been asked twice (@visesh, @rasul) how to realize an exception for "visited links" or "current active links", but you didn't write any reply to these requests.I have the same problem and I hope you can find a little time to answer. Hi David,

is there no solution for an active state of a navigation element.
You have been asked twice (@visesh, @rasul) how to realize an exception for
“visited links” or “current active links”, but you didn’t write any reply to these requests.

I have the same problem and I hope you can find a little time to answer.

]]> By: Rasulhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-18314 Rasul Sun, 20 Jun 2010 19:47:15 +0000 http://davidwalsh.name/?p=1647#comment-18314 Hi David;if one of "Li"s (first li, for exmple) has "current_page_item" class (class="current_page_item") like wordpress menu; how can I disable events for it?Thanks. Hi David;

if one of “Li”s (first li, for exmple) has “current_page_item” class (class=”current_page_item”) like wordpress menu; how can I disable events for it?

Thanks.

]]> By: Roarkhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-16766 Roark Mon, 05 Apr 2010 09:11:49 +0000 http://davidwalsh.name/?p=1647#comment-16766 @William I have the same problem as you, Joomla bounds me to the confines of 1.11, I needed the same effect and used fx.styles. seemed to work ok in ie6: var gallery_a = $$('#slideshow ul li a'); gallery_a.each(function(element) { var fx = new Fx.Styles(element, {duration: 300, wait: false, transition: Fx.Transitions.Sine.easeIn}); element.addEvent('mouseenter', function(){ fx.start({ 'background-position': ['290px 0px', '253px 0px'], 'padding-right': ['0px','50px'] }); }); element.addEvent('mouseleave', function(){ fx.start({ 'background-position': ['253px 0px', '290px 0px'], 'padding-right': ['50px','0px'] }); }); }); @William I have the same problem as you, Joomla bounds me to the confines of 1.11,
I needed the same effect and used fx.styles. seemed to work ok in ie6:
var gallery_a = $$(‘#slideshow ul li a’);
gallery_a.each(function(element) {
var fx = new Fx.Styles(element, {duration: 300, wait: false, transition: Fx.Transitions.Sine.easeIn});
element.addEvent(‘mouseenter’, function(){
fx.start({
‘background-position’: ['290px 0px', '253px 0px'],
‘padding-right’: ['0px','50px']
});
});

element.addEvent(‘mouseleave’, function(){
fx.start({
‘background-position’: ['253px 0px', '290px 0px'],
‘padding-right’: ['50px','0px']
});
});
});

]]> By: Williamhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-11997 William Fri, 18 Sep 2009 17:18:05 +0000 http://davidwalsh.name/?p=1647#comment-11997 @David Walsh: I know :( However, my site runs on joomla and it'll be a lot of backward coding if I upgrade. The 1.1 layer doesn't work with half of my scripts running on the site now. @David Walsh: I know :( However, my site runs on joomla and it’ll be a lot of backward coding if I upgrade. The 1.1 layer doesn’t work with half of my scripts running on the site now.

]]> By: David Walshhttp://davidwalsh.name/snook-navigation-mootools/comment-page-1#comment-11995 David Walsh Fri, 18 Sep 2009 17:07:54 +0000 http://davidwalsh.name/?p=1647#comment-11995 William: 1.1 is almost 2 years old now -- time to upgrade? William: 1.1 is almost 2 years old now — time to upgrade?

]]>