Question

I am using the qtip2 library which looks like this:

$('.selector').qtip({ // options // });

However I have three different selectors which use three different set of options.

Is there a way to write the .qtip part as a function so I can pass the selector, and the options as arguments? I am just changing the position for different selectors, that’s the only thing that is changing…

function doMyQtip(selector, "top left", "bottom right") {

}

Answer 1

Try this:

function changeQtipVars(pos1, pos2){

    var tooltip_opts = {
    position: {
            corner: {
               target: pos1,
               tooltip: pos2
            }
    }
    }
    return tooltip_opts;
}

$('.selector').qtip({
   content: 'Displays the number of results based on your search criteria.',
   show: 'mouseover',
   hide: 'mouseout',
   style: changeQtipVars(pos1, pos2);
})

You can also try a switch case, but that works out to be a tad tedious. You may also want to read up on JQuery’s extend function – http://api.jquery.com/jQuery.extend/ for extending reusable code. Hope this helps.