Home/ Questions/Q 8935223
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T09:56:48+00:00

I am developing an application in Rails 3.2 and trying to add a Nivo

  • 0

I am developing an application in Rails 3.2 and trying to add a Nivo Slider to the front page. After it loads, the transitions look like this. Other transitions have similar distortions.

When the first transition occurs, the length of the page increases by thousands of pixels. I’ve determined that it is the #slider div that is increasing in size. This resets occasionally, but then I see it redraw the thousands of pixels down again.

The div containing the Nivo Slider:

<div id="content">
<link href="/assets/nivo-slider-themes/default/default.css?body=1" media="screen" rel="stylesheet" type="text/css" />
  <div class="slider-wrapper theme-default">
  <div class="ribbon"></div>
  <div id="slider" class="nivoSlider">
    <img src="assets/index_slider_1.jpg">
    <img src="assets/index_slider_2.jpg">
    <img src="assets/index_slider_3.jpg">
  </div>
  <div id="htmlcaption" class="nivo-html-caption">
  </div>
</div>

I am using the default packaged CSS files that come with Nivo Slider 3.1.

JSFiddle containing the problem

What is causing the transition corruption, and the increase in page length due to the slider div’s length increasing?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The CSS file you are using from Nivo is causing the bug. I grabbed a stylesheet from one of the Nivo examples and updated the jsfiddle to this: http://jsfiddle.net/ppDhT/

    <link rel='stylesheet' id='nivoslider-css'  href='http://nivo.dev7studios.com/wp-content/plugins/nivo-slider/scripts/nivo-slider/nivo-slider.css?ver=3.4.2' type='text/css' media='all' />
    • 0