Question

I found a nice jquery slideshow that I want to implement for a friend/client. Normally I can figure these things out, but for some reason I'm stumped.

I want to use a specific transition, and the documentation provided tells me it's an array that I have to add, otherwise the script uses all the transitions randomly.

This is the basic code:

$(function(){
  if(!flux.browser.supportsTransitions)
    alert("Flux Slider requires a browser that supports CSS3 transitions");

  window.f = new flux.slider('#slider', { 
    pagination : true,
  });
});

I've got it all working, just not the specific transition. I've searched and can't find anything that looks like my issue.

i know i use 'transitions' and the transition i want is 'bars3d', but I can't seem to figure it out (I'm rusty - my current job is very "basic" when it comes to programming and I haven't worked properly with javascript/jquery in a couple of years)

Any help would be greatly appreciated.

Was it helpful?

Solution

When you make the instance of a new flux.slider, just add to the option object parameter the key transitions with, as value, an array with a single element.

The element is a string containing 'bars3d'.

I edited the relevant part of your code

For complete reference see https://github.com/joelambert/Flux-Slider

window.f = new flux.slider('#slider', { 
  pagination : true,
  transitions: ['bars3d']
});
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top