Javascript błędne wywoływanie funkcji

Witam. Od pewnego czasu zmagam się z pewnym problem. Chodzi o to, że mam taki oto kod napisany w js, który nie wymaga przeładowywania strony oraz dodaje animację chowania contentu:

$(document).ready(function() {
						   
	var hash = window.location.hash.substr(1);
	var href = $('#nav li a').each(function(){
		var href = $(this).attr('href');
		if(hash==href.substr(0,href.length-5)){
			var toLoad = hash+'.html #content';
			$('#content').load(toLoad)
		}											
	});

	$('#nav li a').click(function(){
								  
		var toLoad = $(this).attr('href')+' #content';
		$('#content').slideUp('slow',loadContent);
		window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-15);
		function loadContent() {
			$('#content').load(toLoad,'',showNewContent());
		}
		function showNewContent() {
			$('#content').slideDown('slow');
		}
		return false;
		
	});

});

Wszystko pięknie działało dopóki nie zapragnąłem dodać mapy google. Aby prawidłowo ona się wyświetlała przez ten skrypt dodałem do powyższego kodu następujące polecenia:

function showNewContent() {
			$('#content').show('slow',mapaStart());
		}
		function mapaStart() {   
            var wspolrzedne = new google.maps.LatLng(44.5296369,10.868598);
            var opcjeMapy = {
              zoom: 10,
              center: wspolrzedne,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy); 
        }   

kiedy mam funkcję mapaStart() wywoływaną w showNewContent wszystko się popsuło. Przy wybieraniu jakiejkolwiek z opcji w menu cały content chowa się, ale nie chce się rozwinąć. Efekt można zobaczyć na www.ellheat.pl/ferraria . Proszę o pomoc

http://www.ellheat.pl/ferraria/contact.html - a tutaj Ci działa. przynajmniej dopóki nie klikniesz w jakiś link który nie prowadzi do 404. Dlaczego? mała podpowiedź w narzędziach deweloperskich w Chrome.
Uncaught TypeError: Cannot read property 'offsetWidth' of null main.js:40 Gl main.js:40 im main.js:46 mapaStart nonreload.js:30 showNewContent nonreload.js:21 loadContent nonreload.js:18 jQuery.speed.opt.complete jquery.js:8519 jQuery.Callbacks.fire jquery.js:2939 jQuery.Callbacks.self.fireWith jquery.js:3051 tick jquery.js:7976 jQuery.fx.tick jquery.js:8551
Tutaj wprawdzie formatowanie mocno się rozjechało, ale w Chrome to był bardzo czytelny backtrace, który czytany od góry z pominięciem plik main.js (który pochodzi od Google i można śmiało założyć że jest dobry), wskazuje na linię 30 pliku noreload.js, gdzie następuje wywołanie metody mapaStart.
Podglądamy więc tę linię:
var mapa = new google.maps.Map(document.getElementById("mapka"), opcjeMapy);

na pierwszy rzut oka w miarę poprawna, ale zwróć uwagę na komunikat błędu, mówiący Cannot read property 'offsetWidth' of null. Czyli chodzi prawdopodobnie o jakiegoś nulla (może to być bardzo słaba poszlaka, bo null mógł się pojawić gdzieś w main.js, ale lepsza taka niż żadna, więc sprawdzamy.
opcjeMapy nullem być raczej nie może, bo parę linii wcześniej tworzysz taką zmienną. więc wpisujemy sobie linię wyżej console.log(document.getElementById("mapka")) - i niespodzianka, znajdujemy nulla. dokument nie zawiera obiektu o id "mapka". Zadbaj o to żeby element z takim ID istniał zawsze kiedy próbujesz się do niego odwołać :)

Mam nadzieję że doczytałeś do końca :)

tl;dr: prześledzić backtrace błędu w konsoli Firebuga/Developer Tools/czegokolwiek czym Twoja przeglądarka dysponuje i poszukać przyczyny :)

Tak doczytałem i dzięki wielkie za pomoc ;) Tak się jeszcze zastanawiam czy da radę to zrobić to samo przez podzielnie tego skryptu (który odpowiada za dynamiczne przechodzenie pomiędzy stronami) na dwa podobne pliki. Do tej pory nie udało mi się tego jeszcze zrobić. Bo tak słabo troszkę jak każda podstrona będzie miała zbędny div, którego id będzie nazywał się mapka wink.gif

zwykły if ....

var mapka = document.getElementById("mapka");
if (mapka) {
  // kod mapki
}