menu LavaLamp, klopot z href="#" Opcje

[edward_kredka]

Witam
Stworzyłem menu LavaLamp według kursu jQuery W Praktyce. Wszystko działa ładnie do czasu wstawienia właściwych odnośników np.:
<li><a href="kontakt.php">Kontakt</a></li>

zamiast domyślnych:
<li><a href="#">Kontakt</a></li>

Po kliknięciu ładuje się strona, ale podświetlane pole zamiast pozostać na wybranym odnośniku np. "Kontakt" wraca na odnośnik domyślny "About us". Przypominam ze na ustawieniach domyślnych href="#" wszystko śmiga dobrze.

kod HTML

CODE

[HTML] pobierz, plaintext 
<ul class="lavaLamp">
                <li><a href="index_en.php">About us</a></li>
                <li><a href="rehabilitation.php">Rehabilitation</a>
                	<ul class="submenu">
                		<li><a href="#">Kinezoteraphy</a></li>
                		<li><a href="#">dr Ackermann Method</a></li>               		
                	</ul>
                </li>                
                <li><a href="massage.php"> Massage </a>
                	<ul class="submenu">
                		<li><a href="#">Klasyczny</a></li>
                		<li><a href="#">Leczniczy</a></li>
                		<li><a href="#">Wyszczuplający</a></li>
						<li><a href="#">Relaksacyjny</a></li>
                	</ul>
                </li>
				<li><a href="#">Cennik</a></li>
                <li><a href="kontakt.php">Kontakt</a></li>
            </ul>
[HTML] pobierz, plaintext 

plik jQuery myLavaLamp.js

CODE

[HTML] pobierz, plaintext 
(function($){
	$.fn.myLavaLamp = function(param){
		var defaults = {
			speed: 300,
			effect: 'linear'
 
		}
		var options = $.extend(defaults, param);
 
		return this.each(function(){
			var $lis = $('> li', this);
			var $highlight = $('<li class="highlight"><div class="inner"></div></li>').appendTo($(this));
			var current = $lis.filter('.active').get(0) || $lis[0];
 
 
			$lis.each(function(){
				if($(this).has('ul.submenu').size() > 0){
					$('ul.submenu', this)
						.css('width', $(this).css('width'))
						.hide();
					$(this)
						.children('a')
						.addClass('hasSubmenu')
						.end()
						.mouseenter(function(){
							if($('ul.submenu', this).css('display') == 'block') return;
 
							$('ul.submenu', this).slideDown("fast");
							////////////
							$('li.highlight')
								.myCorners("0 bl br")
								.children()
								.andSelf()
								.css('border-bottom', '0px');
						})
						.mouseleave(function(){
							if($('ul.submenu', this).css('display') == 'none') return;
 
							$('ul.submenu', this).slideUp("fast");
							////////////
							$('li.highlight')
								.myCorners()
								.css('border-bottom', '1px solid #7cb763');
						});
				}
			});
 
 
			$lis.not('.highlight').mouseover(function(){
				move(this);
			});
 
			$lis.click(function(){
				setCurrent(this);
 
			});
 
			$(this).hover(function(){},
			function(){
				move(current);
			});
 
			setCurrent(current);
			function setCurrent(element){
				$highlight.css({
					'left': element.offsetLeft,
					'width': element.offsetWidth
				});
				current = element;
			}
 
 
			function move(element){
				$highlight.animate({
					'width': element.offsetWidth,
					'left': element.offsetLeft
				}, {
					queue: false,
					duration: options.speed,
					easing: options.effect
				})
			}
		});
	}
})(jQuery)
[HTML] pobierz, plaintext 

plik scripts.js

CODE

[HTML] pobierz, plaintext 
$(document).ready(function(){
 
	$('#top #menu ul.lavaLamp').myLavaLamp({
		speed: 200,
		effect: 'easeOutQuad'
	});
});
[HTML] pobierz, plaintext 

Naprawdę brak mi już pomysłu, na to co jest nie tak. Myślę że może coś w kodzie myLavaLamp.js ale ja jestem początkujący w temacie jQuery i błędu tam nie widzę. Nie daje mi cały czas spokoju myśl dlaczego gdy w odnośniku <a href="#"></a></li> jest "#" wszystko działa poprawnie.