Jump to content

Check out our Community Blogs

Register and join over 40,000 other developers!

Recent Topics

Recent Status Updates

View All Updates

- - - - -

Jquery Slideshow And Swapcontent()

jQuery jquery

  • Please log in to reply
No replies to this topic

#1 Thevenin


    CC Resident

  • Advanced Member
  • PipPipPipPip
  • 66 posts

Posted 15 May 2012 - 02:21 AM

Hi all, I really need some help.

I am making a website with horizontal scroll (working!), then I am using a jQuery Slideshow (called Camera), and I combined this with the horizontal scrolling website.
When I select the page I want from the menu, the website scrolls to right and automatically it loads from database a list of images in the Slideshow.

I have a menu with some button and each button call this "swapContent(cv)" function:
function swapContent(cv) {
	var url = "evaluation_menu.php";
	$.post(url, {contentVar: cv}, function(data) {
			pagination: false

HTML code:
<a class="next page" title="Title 1" href="#page" onClick="return false" onmousedown="javascript:swapContent('title1');"><div id="title1"></div></a>
<a class="next page" title="Title 2" href="#page" onClick="return false" onmousedown="javascript:swapContent('title2');"><div id="title2"></div></a>

The menu is in the homepage and in the other page (just one page), but every time I click on a button it seems that the "camera" div is replicated inside x1, x2 and so on.

So I thought something like a refresh of the ".camera" div and then load the new content selected from the menu; but using "location.reload()", the reload works correctly, but not load the selected content.

Yesterday I thought to using a tabbed Ajax function, I found on a website some code:

  //if uncomment the above line, html5 nonsupported browers won't change the url but will display the ajax content;
  //if commented, html5 nonsupported browers will reload the page to the specified link.

  //get the link location that was clicked
  pageurl = $(this).attr('href');

  //to get the ajax content and display in div with id 'content'
  $.ajax({url:pageurl+'?rel=tab',success: function(data){

  //to change the browser URL to 'pageurl'
  return false;
// the below code is to override back button to get the ajax content without reload
$(window).bind('popstate', function() {
$.ajax({url:location.pathname+'?rel=tab',success: function(data){

HTML code:
<a class="next page" title="Title 1" href="#page" onClick="return false" onmousedown="javascript:swapContent('title1');" rel="tab"><div id="title1"></div></a>

This tabbed things works, pretty well, but don't know if and how to mix it with my code.

Any hint/help is really appreciated.
  • 0

Also tagged with one or more of these keywords: jQuery, jquery

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download