How to reset a jquery function on-the-fly


Tags: php,jquery,html,css

Problem :

I have a little question for you that I don't know how to fix. This is the situation, I am using a jQuery Slideshow (called Camera), and I combined this with an horizontal scrolling website.

When I select the page I want from the menu, the website scrolls to right and automatically I load from database a list of images in the Slideshow.

Unfortunately when I choose another section from the menu, it loads not correctly the images.

I'd like to reset the old CSS class or reset my function, I mean a reload of the entire function each time I press a button of the menu.

This is my function:

function swapContent(cv) {
    $(".camera").html("Loading...").show();
    var url = "evaluation_menu.php";
    $.post(url, {contentVar: cv}, function(data) {
        $(".camera").html(data).show(); 
        $('.camera').camera({
            pagination: false
        });
    });
}

This is how I use it:

<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>

Everytime I press a button it executes this function that reads and executes a query on the database.

I thought to use something in the onClick, but don't know what and how.

Any help is really appreciated.



Solution :

Maybe I found a little way to a possible solution, but this doesn't work as I want.

function swapContent(cv) {
$(".camera").html("Loading...").show();
var url = "evaluation_menu.php";
location.reload();   // reload the page
$.post(url, {contentVar: cv}, function(data) {
    $(".camera").html(data).show(); 
    $('.camera').camera({
        pagination: false
    });
  });
}

If I use "location.reload();" when I click on a button on the menu from the slided page, the slide refreshes but doesn't load the content


    CSS Howto..

    How to link to an image from a CSS file when using the resource plugin 1.2.14

    How to stop my css declaration from being overridden

    How to remove the double scroll?

    CSS Image size, how to fill, not stretch?

    How to expand and
  • to fit the width of the
      using css? (or even jquery)
  • How to render a template containing CSS with }} sequence inside using Twig

    How can I stop mobile Safari from pausing before beginning a transition

    How to align images to the bottom with css?

    How to use CSS selectors [closed]

    How to align jQuery div to bottom left corner using CSS?

    How to get different style in nested element depending to depth level?

    How do I make my CSS link up to files in different directories

    How to place scroll bar on side of table?

    attaching div to a specific element for showing with javascript

    How to use imported css styles in GWT correctly

    How to add HTML/CSS using the editor on DNN? How to add markup without relying on modules?

    How to create sub-labels for input elements using HTML

    how do i set the text that my json file is printing to screen i want to hide the text

    How to properly adjust CSS Form Select field if content is larger than image

    How to put Facebook and Twitter buttons next to each other?

    How to pin the menu to the upper part of the screen?

    How to force the casing of letters in a textbox

    How to make this css crossbrowser?

    How do I center text next to a floating image using css?

    How to disable custom animations from click, angular?

    How to set the text absolutely (CSS) in the middle of a div despite a changing width div behind him?

    CSS: How to have to divs side by side with height 100%?

    How to select the first element of n>4 elements with CSS only?

    How to make a transition in height without knowing the height before?

    How to set full auto width for input tag