Javascript not working in Revo 2.1.1 - newbie needing help

0 Posts

throttle Reply #1, 15 years, 4 months ago

Hi,

I’ve done a lot of trawling the forum and the wider internet before posting, but can’t find a solution to my problem.

I’m new to MODx and am developing a site, which is working fine as straight HTML, see http://upwebdesign.co.uk/urbane.html, but when translating it into MODx, none of the Javascript functionality works, which includes the initial ’splash page’, the navigation rollover and the background image rollovers in the 3 boxes at the bottom of the page, http://supamarket.co.uk/

I’ve done my best to get the folder hierarchies correct for the js and css files and as far as I’m aware, don’t have the quick editor enabled, which I know has caused others some problems.

Here is the code I have in the MODx head tag, to demonstrate the paths to the Javascript:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=[[++modx_charset]]" />
<title>[[*pagetitle]] | [[++site_name]]</title>
<meta name="description" content="[[*description]]">
<meta name="keywords" content="">
<base href="[[++site_url]]">

<link rel="stylesheet" type="text/css" href="assets/templates/homepage/styles.css" />
<link rel="stylesheet" type="text/css" href="assets/templates/homepage/splashscreen.css" />

<script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.min.js"></script>
<script src="assets/templates/homepage/jquery.splashscreen.js"></script>
<script src="assets/templates/homepage/script.js"></script>
</head>

Can anyone offer any help to this much frustrated new user?

Many thanks
Matt

152 Posts

Henrik Nielsen Reply #2, 15 years, 4 months ago

Welcome to the forum!

Try to validate the page with http://validator.w3.org/ - you’re having multiply html errors. For example in line 3 where you’re starting html again.
Furthermore 7 images are missing and give 404’s. You can see them with Firebug in Firefox under the net tab.

- A small step for mankind, so why not take two...

Working with web production, graphic design/workflow, photo and education - but are trying to get a life in between!

863 Posts

Lucas Reply #3, 15 years, 4 months ago

As suggested, I would look at all your image paths especially in your jquery code.

0 Posts

throttle Reply #4, 15 years, 4 months ago

Thanks to you both for your help on this.

With yours and the help provided here http://modxcms.com/forums/index.php/topic,2622.0.html, I managed to crack it.

697 Posts

jusmeig Reply #5, 15 years, 4 months ago

Quote from: throttle at Jun 13, 2011, 03:40 PM

Thanks to you both for your help on this.

With yours and the help provided here http://modxcms.com/forums/index.php/topic,2622.0.html, I managed to crack it.

Don’t link to JQuery off your own domain, bad practice.
You have no control over the availability of, http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.min.js
You will get no warning etc if they decide to pull it. Host it on your domain.

J

863 Posts

Lucas Reply #6, 15 years, 4 months ago

Or even better, link to Google’s version as chances are your visitor will have it cached already from another website.

Then specify a local fallback in case the remote version is down for any reason.

Example from HTML5 Boilerplate:

<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.5.1.min.js">\x3C/script>')</script>

The second script tag will only be written page and then loaded if jQuery has not already loaded from Google.