Value of # in URL identified but function values not executing

I have a header on a certain page that displays different images and info depending on what button you click on the page, all works fine. But for some reason something I set up a while back no longer works, where the headers contents reacts to whatever is the value of # when coming from another page.

So I have the following url and hash value - http://www.mysite.com/modules.php#securitycheck

The following code is looking to see if there a # and what its value is and that works fine as have put an alert on it and its definitely pulling out the correct function.

$( document ).ready(function() {

var fns = {
brandcheck: BRAND,	
standardscheck: STANDARDS,
roomcheck: ROOM,
foodcheck: FOOD,
securitycheck: SECURITY,
labcheck: LAB,
aquacheck: AQUA,
poolcheck: POOL,
spacheck: SPA,
firecheck: FIRE,
safetycheck: SAFETY,
crisischeck: CRISIS,
supplycheck: SUPPLY,
ecocheck: ECO,
accesscheck: ACCESS,
dinecheck: DINE,
tourcheck: TOUR,
}

var hash = window.location.hash.slice(1);
var fn = fns[hash];
//alert (fn);
if (fn){
fn();
} else {
$('header').css({'background':'url(../img/modules/Brand.png)'});
$('header').css({'padding-top':'31.25%'});
$('header h1 span').text("BrandCheck");
$('header .intro-text p').text("provides the tools and support necessary to create, develop, maintain or protect the business brand standards.");
$('header .intro-text .modules_header_black .link').text("Download BrandCheck PDF");
$('header .intro-text .modules_header_black').css({'background-color':'#f68834'});

var a = document.getElementById('module_link');
a.href = "/PDF/Cristal_BrandCheck_Datasheet.pdf"
}});

And this is the content of the SECURITY() function, but it doesnt change the header, but if I take the hash away the other part of the if else statement works fine.

function SECURITY(){
$('header').css({'background':'url(../img/modules/Security.png)'});
$('header h1 span').text("SecurityCheck");
$('header .intro-text p').text("helps hoteliers identify weak points in their security arrangements, whether physical or procedural.");
$('header .intro-text .modules_header_black .link').text("Download SecurityCheck PDF");
$('header .intro-text .modules_header_black').css({'background-color':'#C6202C'});
var a = document.getElementById('module_link');
a.href = "/PDF/Cristal_SecurityCheck_Datasheet.pdf"
};

This is what alert(fn); outputs, so to me it seems fine, but its just not being executed.

function SECURITY(){
$('header').css({'background':'url(../img/modules/Security.png)'});
$('header h1 span').text("SecurityCheck");
$('header .intro-text p').text("helps hoteliers identify weak points in their security arrangements, whether physical or procedural.");
$('header .intro-text .modules_header_black .link').text("Download SecurityCheck PDF");
$('header .intro-text .modules_header_black').css({'background-color':'#C6202C'});

var a = document.getElementById('module_link');
a.href = "/PDF/Cristal_SecurityCheck_Datasheet.pdf"
}

OK I got it sorry, it wasnt a jscript issue, it was a css issue, I needed to add padding-top:31.25% to the chunk of code

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.