AJAX and jQuery - How to locate files in a specific folder?
Hi,
Since a few days I am into jQuery and I am getting the hang of it with the basics.
I have this script here which uses jQuery and AJAX - it makes you switch between pages without leaving the index page the user visits.
There were a few problems with the script but I manage to solve these. However, there's one problem left that prevents me from checking if everything works and to make the script run correctly: the script does not correctly locate the .html-files it requires to switch between pages.
The .html-files are located in a specific folder (../pages/), the same folder as the index-page. The reason why it cannot locate the files is, because I sorted all related files in specific folders (example: JavaScript in ../js/, CSS in ../css/ etc.).
There is probably a really easy code for that, but I wasn't able to find it. I'm a very beginner at both of these languages, so I'm sorry if this sounds extremely stupid.
Here is the script:
- jQuery(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 #contentBox1.div';
- $('#contentBox1.div').load(toLoad)
- }
- });
- $('nav li a').click(function(){
-
- var toLoad = $(this).attr('href')+' #contentBox1.div';
- $('#contentBox1.div').fadeOut('fast',loadContent);
- $('#load').remove();
- $('.wrapper').append('<span id="load">LOADING...</span>');
- $('#load').fadeIn('normal');
- window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
- function loadContent() {
- $('#contentBox1.div').load(toLoad,'',showNewContent())
- }
- function showNewContent() {
- $('#contentBox1.div').fadeIn('normal',hideLoader());
- }
- function hideLoader() {
- $('#load').fadeOut('normal');
- }
- return false;
-
- });
- });
I hope you guys can help me out and I have been clear enough with everything I put in this post.