Page 1 of 1
Easy way to load content without page refresh
Posted: Sat May 09, 2009 9:47 am
by fredd
First make sure you have jQuery in the head section.
For example like this:
Code: Select all
<__script__ type="text/javascript" src="uploads/jquery.js"></__script>
Then add this to the head section:
Code: Select all
<__script__ type='text/javascript'>
$(document).ready(function(){
$("a").click(function() {
var contentDivId = 'content';
var loadImgAlt = 'Loading content, please wait..';
var loadImgUrl = 'uploads/images/loading.gif';
var temp = $(this).attr("href")+"&showtemplate=false";
var temp2 = temp.replace(/amp;/g,'');
$("#"+contentDivId).html("<img src='"+loadImgUrl+"' alt='"+loadImgAlt+"' />");
$("#"+contentDivId).load(temp2);
});
});
</__script>
Re: Easy way to load content without page refresh
Posted: Sat May 09, 2009 3:43 pm
by SimonSchaufi
well done!
is there an easy way to work with anchors in the url? i see that in facebook for example or here:
http://www.be-lufthansa.com/
the cool thing is that if the url with an anchor is not possible to load in the div, it refreshes the whole page with the correct url.
To see what i mean, do the following:
- click on a link: result: # in the url with the new target
- click refresh button in the browser: part after # will be used to redirect to the correct url
Re: Easy way to load content without page refresh
Posted: Sat May 09, 2009 6:39 pm
by JeremyBASS
This is not a CMSMS trick here... sorry... thought it's handy for any site... I did something little more elaborate a ways back...
http://www.hellscanyonsportfishing.com/ ... d-cam.html
just does that every 30 sec... but I didn't post it here though that whole site is CMSMS driven, as it's a jQuery topic... and there are much shorter ways to do this...
This is just My2Cents ... and by now means I'm trying to knock you from sharing... Have a great weekend...
Cheers
Jeremy
Re: Easy way to load content without page refresh
Posted: Sat May 09, 2009 6:52 pm
by JeremyBASS
here was an old post in the gen area... it has some good stuff there too
http://forum.cmsmadesimple.org/index.ph ... 003.0.html
Cheers
jeremyBass
Re: Easy way to load content without page refresh
Posted: Sun May 10, 2009 2:23 am
by viebig
SimonSchaufi wrote:
well done!
is there an easy way to work with anchors in the url? i see that in facebook for example or here:
http://www.be-lufthansa.com/
the cool thing is that if the url with an anchor is not possible to load in the div, it refreshes the whole page with the correct url.
To see what i mean, do the following:
- click on a link: result: # in the url with the new target
- click refresh button in the browser: part after # will be used to redirect to the correct url
Actually there is, not rally simple, but having archors pointing to pages is a really bad to search engines and social bookmarks.
Regards
Re: Easy way to load content without page refresh
Posted: Sun May 10, 2009 12:18 pm
by SimonSchaufi
viebig wrote:
SimonSchaufi wrote:
well done!
is there an easy way to work with anchors in the url? i see that in facebook for example or here:
http://www.be-lufthansa.com/
the cool thing is that if the url with an anchor is not possible to load in the div, it refreshes the whole page with the correct url.
To see what i mean, do the following:
- click on a link: result: # in the url with the new target
- click refresh button in the browser: part after # will be used to redirect to the correct url
Actually there is, not rally simple, but having archors pointing to pages is a really bad to search engines and social bookmarks.
Regards
well, better then not showing any difference like the code from fredd. if you load another content in the content area there is no way to find out WHAT content. with the anchors you know it exactly.
Re: Easy way to load content without page refresh
Posted: Tue Aug 11, 2009 5:46 pm
by spiriralph
Re: Easy way to load content without page refresh
Posted: Sat Feb 27, 2010 12:05 pm
by opawaldburger
hey!
I would love to load page content without refreshing the site! So I tried this method and it simply doesn't work. Is the script out of date and not compatible any more or have I done anything wrong?
I created a special site for testing, which can be reached
here. Site "Test1" is linked to "Test2" and back - so the content should be loaded.
I inserted both scripts, though nothing happens!
Best wishes,
Opa