2

I'm using NivoSlider and I'm not really good on using javascript so I was wondering if how can I change the transition effects on nivo-slider? or can I change it? If it is possible, I would like to use only one transition effects on my images. Please help.

woninana
  • 3,409
  • 9
  • 42
  • 66

3 Answers3

3
// This is the default setting:
$('#slider').nivoSlider({effect:'random'}) // Each transition effect will be random

// You can choose from the following effects:

  • sliceDown
  • sliceDownLeft
  • sliceUp
  • sliceUpLeft
  • sliceUpDown
  • sliceUpDownLeft
  • fold
  • fade
  • random
  • slideInRight
  • slideInLeft
  • boxRandom
  • boxRain
  • boxRainReverse
  • boxRainGrow
  • boxRainGrowReverse
Fidi
  • 5,754
  • 1
  • 18
  • 25
  • In your answer you should include where to put that code. I could figure it out if i looked hard enough, and in this case I have to, but the problem with 90% of the answers on this website is that they don't tell us where to put the code. – Mark Kramer Sep 27 '11 at 03:54
  • The values in the list can be used instead of "random" in my code-example. I don't think that's to hard to understand. Or what do you mean by "where to put that code?". And if you found out, why don't you share? You're doing the same thing right now: not telling the others where to put that code ;) I'm just saying. – Fidi Sep 27 '11 at 08:09
  • I didn't find out because I didn't look (I'm happy with the random effect, I was just curious about how to set the transition effect) =p and I wasn't talking about the code in the list, I was talking about the code at the top. – Mark Kramer Sep 27 '11 at 08:13
  • And I just tested it on my page just to find out, the code goes in the function call at the bottom of the page. like this: `` – Mark Kramer Sep 27 '11 at 08:18
1

There are a number of "effects" the Nivo slider supports for transitions - have you seen the usage page yet? You pass an object literal to the nivoSlider call with the parameters you want to use, effect being one of them you can specify. A list of how all the parameters you can set are shown and immediately following that is a list of the available effects. You'll have to be more specific about what specific effect you want if you want a more specific answer.

kinakuta
  • 9,029
  • 1
  • 39
  • 48
0
<script type="text/javascript">
    $(window).load(function() {
                    $('#slider').nivoSlider({effect:"fade"});
                    });
    </script>

Use other effects as per your need in place of "fade"

Vivek
  • 1,446
  • 18
  • 27