jQuery — Update a function's initial parameters via a variable which changes according to user activity?

Question

I don't understand how to update a fucntion's initial parameters once they've been set.

I'm using a plugin called serialScroll. The plugin scrolls to items that are indicated in the initial $(elem).serialScroll({//...}) setup.

What i want to do is redefine the name of that item as the user interacts with the page. I have another variable which is successfully picking up information as the user scrolls around, that much i have.

All i want to do is make serialScroll({)} update it's "item:_" field accordingly with that variable.

Here is the serialScroll code:

    var nextClass = ".fig4"; 

    // this is being changed to .figN depending on the users 
    // scrolling position in the browser/viewport (successfully). 
    // For proof of communication purposes I forced nextClass 
    // here to equal .fig4 to see if the two are at lest talking to 
    // each other, which they are... but now how do i update "items:" 
    // below to reflect the change in the "nextClass" variable?

$('html').serialScroll({
    target:'body',
    items: nextClass, 
    next:'#nextImage',
    axis:'y',
    duration:700,
    force:true, 
});

Steve Costello · Accepted Answer · 2011-04-20T18:12:48.317

1

What is happening here is that when .serialScroll is initialized, it gets the value of nextClass once, and that is the value it uses.

One of two things would need to happen. Either you modify the plugin to use a global variable (not terrificly ideal, but it works), or every time nextClass changes, you need to reinitialize .serialScroll.

edited Apr 20 '11 at 18:12

answered Apr 20 '11 at 17:34

Steve Costello

380
2
13

Hmm I'm ok with modifying the plugin actually. The problem with option two is that the variable is changing on window scroll... so it'll keep firing the function which isnt right. I'd need some kind of scroll stop event, of which there isnt any. – RGBK Apr 20 '11 at 17:49
I see. In that case, you'll definitely want to modify the actual plugin. Why not build into the plugin the functionality that if there is no "items" specified, that it uses this nextClass variable? Do you use nextClass for anything else? If not, you could localize the function only to the plugin. Otherwise, you'll need to tie together this nextClass functionality and the .serialScroll functionality all the time. Not a huge deal if you don't think that you need that modularity. – Steve Costello Apr 20 '11 at 17:55
Cheers Steve, that worked a charm. Bit of a hack but i really dont need the function for anything else and i was bending the use of it as it was. – RGBK Apr 20 '11 at 18:07

score 1 · Answer 2 · answered Apr 20 '11 at 18:04

JavaScript objects are dynamic and you can always add methods to them. As serialScroll is bunch of functions added dynamically to the element it is called upon, there are two ways to accomplish what you need:

Add a setter to the plugin code - this would make it work across all installations
monkey-patch every instance of serialScroll, after initializing

If you only have one instance, then the latter is easier and should prove more forward-compatible:

$('html').serialScroll({...});
$('html').serialScroll.setItems = function(i){
  items = i;
}
// when nextClass changes
$('html').serialScroll.setItems(nextClass);

To accomplish the first option, you would need to hack into the serialScroll code itself.

jQuery — Update a function's initial parameters via a variable which changes according to user activity?

2 Answers2