I am using a theme from wrapbootstrap on a project and I am getting a Not a number value on the slider which is causing some minor performance issues with site speed.

Here is a link to the theme: .0/index.html

Please see the chrome console error for:

invalid left tween value: NaN

Does anyone know how to get around this issue? Would be appreciated, even if a quick fix/workaround.

I am using a theme from wrapbootstrap on a project and I am getting a Not a number value on the slider which is causing some minor performance issues with site speed.

Here is a link to the theme: http://themes.iamabdus./bigbag/1.0/index.html

Please see the chrome console error for:

invalid left tween value: NaN

Does anyone know how to get around this issue? Would be appreciated, even if a quick fix/workaround.

• javascript
• jquery
• revolution-slider

• same issue here – Marco Commented Oct 21, 2016 at 15:12
• yeah, me too. it is ing from ThemePunch Slider Revolution, due to the revolution slider. I think it might be due to a slider having been present in the dom, but no longer on the page -- so ThemePunch can't figure out where it should slide to. – jedison Commented Oct 25, 2016 at 17:07
• facing the same issue in angular 2 website. – Niraj Commented Dec 12, 2016 at 12:35
• Having the same issue with angular2. Can anyone tell me the solution? – KiranPurbey Commented Dec 25, 2017 at 5:10
• Did anyone get the solution? Please help me – Tajkumar Commented Dec 16, 2019 at 5:22

4 Answers 4

I saw this line in the debugger parseFloat(RegExp.$1) / 100, which looks like it could be responsible for the error. RegExp.$1-$9:

This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large inpatibilities between implementations and the behavior may change in the future.

I would try modifying these expressions and see if it helps.

i had the same problem and found solution. In your banner html code you have four divs like :

        <div class="tp-caption rs-caption-1 sft start"
             data-hoffset="0"
             data-x="370"
             data-y="54"
             data-speed="800"
             data-start="1500"
             data-easing="Back.easeInOut"
             data-endspeed="300">
              ...
        </div>

        <div class="tp-caption rs-caption-2 sft"
             data-hoffset="0"
             data-y="119"
             data-speed="800"
             data-start="2000"
             data-easing="Back.easeInOut"
             data-endspeed="300">
            ...
        </div>

        <div class="tp-caption rs-caption-3 sft"
             data-hoffset="0"
             data-y="185"
             data-speed="1000"
             data-start="3000"
             data-easing="Power4.easeOut"
             data-endspeed="300"
             data-endeasing="Power1.easeIn"
             data-captionhidden="off">
             ...
        </div>
        <div class="tp-caption rs-caption-4 sft"
             data-hoffset="0"
             data-y="320"
             data-speed="800"
             data-start="3500"
             data-easing="Power4.easeOut"
             data-endspeed="300"
             data-endeasing="Power1.easeIn"
             data-captionhidden="off">
          ...
        </div>

To fix this error, simply add data-x="0" into three last elements.

I came across the same error for a wrapbootstrap theme as well and I looked further into jedison's ment and sure enough this was the case for my app.

When I logout of my ionic app, I clear out my pages. However, the revolution init function is still being called and this throws the error.

The solution that worked for me was I put this line in my logout function,

jQuery('#rev-slider').revpause();

then on login, all pages are reloaded, with a new rev slider and its init function.

If you modified the caption style of revolution slider, this error occurs.
Because it breaks the animation engine. For example

.big_white {
  left: 0 !important;
  bottom: 0 !important;
  width: 100%;
  padding-bottom: 10px;
  ...

You have to remove left value of css