jquery.themepunch.tools.min.js：103无效zIndex补间值：undefined

Question

我有一个问题试图解决这个问题。每当我返回到特定页面时，我的滑块都会中断。一直抛出错误：jquery.themepunch.tools.min.js：103无效zIndex补间值：undefined

我已经更新了革命滑块的所有css和JS文件，但仍然得到同样的问题。

*正如一个方面说明 - 我运行它在角CLI *

可有人请指教？

x.test("string"==typeof a?a:(a.currentStyle?a.currentStyle.filter:a.style.filter)||"")?parseFloat(RegExp.$1)/100:1},W=function(a){_gsScope.console&&console.log 

<div id="rev_slider_1_1_wrapper" class="rev_slider_wrapper fullscreen-container" data-alias="home-01" data-source="gallery" style="background-color:transparent;padding:0px;"> 
    <!-- START REVOLUTION SLIDER fullscreen mode --> 
    <div id="rev_slider_1_1" class="rev_slider fullscreenbanner" style="display:none;" data-version="5.4.5.1"> 
     <ul> <!-- SLIDE --> 
     <li data-index="rs-1" data-transition="fade" data-slotamount="default" data-hideafterloop="0" data-hideslideonmobile="off" data-easein="default" data-easeout="default" data-masterspeed="300" data-rotate="0" data-saveperformance="off" data-title="Slide" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description=""> 
      <!-- MAIN IMAGE --> 
      <img src="assets/images/uploads/slider-home-01-slide-01-background.jpg" alt="" data-bgposition="center bottom" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina> 
      <!-- LAYERS --> 

      <!-- LAYER NR. 1 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-1-layer-1" 
       data-x="['right','right','right','right']" data-hoffset="['-127','10','5','10']" 
       data-y="['middle','middle','middle','bottom']" data-voffset="['-28','0','133','10']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="image" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 5;"><img src="assets/images/uploads/slider-home-01-slide-01-object-01.png" alt="" data-ww="['905','605','471','286']" data-hh="['824','588','438','307']" width="930" height="876" data-no-retina> </div> 

      <!-- LAYER NR. 2 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-1-layer-2" 
       data-x="['left','left','left','left']" data-hoffset="['10','10','10','10']" 
       data-y="['middle','middle','middle','middle']" data-voffset="['-231','-231','-231','-231']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 6; white-space: nowrap; font-size: 24px; line-height: 24px; font-weight: 400; color: rgba(142, 179, 90, 1.00);font-family:Playfair Display;font-style:italic;letter-spacing:0.2em;">Good for nature, </div> 

      <!-- LAYER NR. 3 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-1-layer-3" 
       data-x="['left','left','left','left']" data-hoffset="['10','10','10','10']" 
       data-y="['middle','middle','middle','top']" data-voffset="['-157','-157','-157','166']" 
       data-fontsize="['80','80','80','70']" 
       data-fontweight="['700','700','700','400']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 7; white-space: nowrap; font-size: 80px; line-height: 80px; font-weight: 700; color: rgba(51, 51, 51, 1.00);font-family:Playfair Display;">good for you </div> 

      <!-- LAYER NR. 4 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-1-layer-4" 
       data-x="['left','left','left','left']" data-hoffset="['9','9','9','10']" 
       data-y="['middle','middle','middle','top']" data-voffset="['-16','-16','-16','299']" 
       data-width="['470','470','470','355']" 
       data-height="['123','123','123','122']" 
       data-whitespace="normal" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 8; min-width: 470px; max-width: 470px; max-width: 123px; max-width: 123px; white-space: normal; font-size: 15px; line-height: 26px; font-weight: 400; color: rgba(121, 117, 117, 1.00);font-family:Lato;">We don’t just bring organic produce to your door — we nurture it from seed, we harvest it by hand and we understand the responsibility entrusted to us as farmers. </div> 

      <!-- LAYER NR. 5 --> 
      <div class="tp-caption rev-btn " 
       id="slide-1-layer-5" 
       data-x="['left','left','left','left']" data-hoffset="['10','10','10','10']" 
       data-y="['middle','middle','middle','middle']" data-voffset="['62','62','62','98']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="button" 
       data-responsive_offset="on" 
       data-responsive="off" 
       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"},{"frame":"hover","speed":"0","ease":"Linear.easeNone","to":"o:1;rX:0;rY:0;rZ:0;z:0;","style":"c:rgba(255, 255, 255, 1.00);bg:rgba(142, 179, 90, 1.00);bw:1px 1px 1px 1px;"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[12,12,12,12]" 
       data-paddingright="[35,35,35,35]" 
       data-paddingbottom="[12,12,12,12]" 
       data-paddingleft="[35,35,35,35]" 

       style="z-index: 9; white-space: nowrap; font-size: 16px; line-height: 16px; font-weight: 700; color: rgba(142, 179, 90, 1.00);font-family:Lato;background-color:rgba(142, 179, 90, 0);border-color:rgba(142, 179, 90, 1.00);border-style:solid;border-width:1px;border-radius:30px 30px 30px 30px;outline:none;box-shadow:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;cursor:pointer;">SHOP NOW </div> 

      <!-- LAYER NR. 6 --> 
      <div class="tp-caption insight-dots-style-2 tp-resizeme" 
       id="slide-1-layer-6" 
       data-x="['right','right','right','right']" data-hoffset="['138','138','138','138']" 
       data-y="['bottom','bottom','bottom','bottom']" data-voffset="['22','22','22','22']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 10; white-space: nowrap;">01 </div> 
     </li> 
     <!-- SLIDE --> 
     <li data-index="rs-2" data-transition="fade" data-slotamount="default" data-hideafterloop="0" data-hideslideonmobile="off" data-easein="default" data-easeout="default" data-masterspeed="300" data-rotate="0" data-saveperformance="off" data-title="Slide" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description=""> 
      <!-- MAIN IMAGE --> 
      <img src="assets/images/uploads/slider-home-01-slide-01-background.jpg" alt="" data-bgposition="center bottom" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina> 
      <!-- LAYERS --> 

      <!-- LAYER NR. 7 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-2-layer-2" 
       data-x="['left','left','left','left']" data-hoffset="['45','45','45','16']" 
       data-y="['middle','middle','middle','middle']" data-voffset="['-163','-163','-163','-223']" 
       data-width="449" 
       data-height="36" 
       data-whitespace="normal" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['center','center','center','center']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 11; min-width: 449px; max-width: 449px; max-width: 36px; max-width: 36px; white-space: normal; font-size: 34px; line-height: 34px; font-weight: 400; color: rgba(142, 179, 90, 1.00);font-family:Playfair Display;font-style:italic;letter-spacing:0.2em;">Live Organic </div> 

      <!-- LAYER NR. 8 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-2-layer-3" 
       data-x="['left','left','left','left']" data-hoffset="['47','47','47','45']" 
       data-y="['middle','middle','middle','top']" data-voffset="['-67','-67','-67','173']" 
       data-fontsize="['80','80','80','70']" 
       data-fontweight="['700','700','700','400']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['center','center','center','center']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 12; white-space: nowrap; font-size: 80px; line-height: 80px; font-weight: 700; color: rgba(51, 51, 51, 1.00);font-family:Playfair Display;">Live healthy </div> 

      <!-- LAYER NR. 9 --> 
      <div class="tp-caption rev-btn " 
       id="slide-2-layer-5" 
       data-x="['left','left','left','left']" data-hoffset="['181','181','181','146']" 
       data-y="['middle','middle','middle','middle']" data-voffset="['103','103','103','4']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="button" 
       data-responsive_offset="on" 
       data-responsive="off" 
       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"},{"frame":"hover","speed":"0","ease":"Linear.easeNone","to":"o:1;rX:0;rY:0;rZ:0;z:0;","style":"c:rgba(255, 255, 255, 1.00);bg:rgba(142, 179, 90, 1.00);bw:1px 1px 1px 1px;"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[12,12,12,12]" 
       data-paddingright="[35,35,35,35]" 
       data-paddingbottom="[12,12,12,12]" 
       data-paddingleft="[35,35,35,35]" 

       style="z-index: 13; white-space: nowrap; font-size: 16px; line-height: 16px; font-weight: 700; color: rgba(142, 179, 90, 1.00);font-family:Lato;background-color:rgba(142, 179, 90, 0);border-color:rgba(142, 179, 90, 1.00);border-style:solid;border-width:1px;border-radius:30px 30px 30px 30px;outline:none;box-shadow:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;cursor:pointer;">SHOP NOW </div> 

      <!-- LAYER NR. 10 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-2-layer-4" 
       data-x="['left','left','left','left']" data-hoffset="['7','7','7','60']" 
       data-y="['middle','middle','middle','top']" data-voffset="['15','15','15','281']" 
       data-fontsize="['24','24','24','15']" 
       data-lineheight="['24','24','24','26']" 
       data-fontweight="['700','700','700','400']" 
       data-color="['rgba(105, 105, 105, 1.00)','rgba(105, 105, 105, 1.00)','rgba(105, 105, 105, 1.00)','rgba(121, 117, 117, 1.00)']" 
       data-width="['520','520','520','356']" 
       data-height="['29','29','29','none']" 
       data-whitespace="normal" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['center','center','center','center']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 14; min-width: 520px; max-width: 520px; max-width: 29px; max-width: 29px; white-space: normal; font-size: 24px; line-height: 24px; font-weight: 700; color: rgba(105, 105, 105, 1.00);font-family:Lato;text-transform:uppercase;letter-spacing:0.7em;">Trust the nature </div> 

      <!-- LAYER NR. 11 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-2-layer-1" 
       data-x="['right','right','right','right']" data-hoffset="['-276','-155','-99','10']" 
       data-y="['middle','middle','middle','bottom']" data-voffset="['-3','13','266','10']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="image" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 15;"><img src="assets/images/uploads/slider-home-01-slide-02-object-01.png" alt="" data-ww="['995px','605','471','286']" data-hh="['859px','588','438','307']" width="995" height="859" data-no-retina> </div> 

      <!-- LAYER NR. 12 --> 
      <div class="tp-caption tp-resizeme" 
       id="slide-2-layer-6" 
       data-x="['right','right','right','right']" data-hoffset="['577','353','294','288']" 
       data-y="['middle','middle','middle','middle']" data-voffset="['18','46','262','199']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="image" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 16;"><img src="assets/images/uploads/slider-home-01-slide-02-object-02.png" alt="" data-ww="['140px','140px','140px','140px']" data-hh="['140px','140px','140px','140px']" width="140" height="140" data-no-retina> </div> 

      <!-- LAYER NR. 13 --> 
      <div class="tp-caption insight-dots-style-2 tp-resizeme" 
       id="slide-2-layer-7" 
       data-x="['right','right','right','right']" data-hoffset="['138','138','138','138']" 
       data-y="['bottom','bottom','bottom','bottom']" data-voffset="['22','22','22','22']" 
       data-width="none" 
       data-height="none" 
       data-whitespace="nowrap" 

       data-type="text" 
       data-responsive_offset="on" 

       data-frames='[{"from":"opacity:0;","speed":300,"to":"o:1;","delay":500,"ease":"Power2.easeInOut"},{"delay":"wait","speed":300,"to":"opacity:0;","ease":"nothing"}]' 
       data-textAlign="['left','left','left','left']" 
       data-paddingtop="[0,0,0,0]" 
       data-paddingright="[0,0,0,0]" 
       data-paddingbottom="[0,0,0,0]" 
       data-paddingleft="[0,0,0,0]" 

       style="z-index: 17; white-space: nowrap;">02 </div> 
     </li> 
     <!-- SLIDE --> 
     <li data-index="rs-3" data-transition="fade" data-slotamount="default" data-hideafterloop="0" data-hideslideonmobile="off" data-easein="default" data-easeout="default" data-masterspeed="300" data-rotate="0" data-saveperformance="off" data-title="Slide" data-param1="" data-param2="" data-param3="" data-param4="" data-param5="" data-param6="" data-param7="" data-param8="" data-param9="" data-param10="" data-description=""> 
      <!-- MAIN IMAGE --> 
      <img src="assets/images/uploads/slider-home-01-slide-03-bg.jpg" alt="" data-bgposition="center center" data-bgfit="cover" data-bgrepeat="no-repeat" class="rev-slidebg" data-no-retina> 

Answer 1

问题是与滑块转。需要更新到所有插件的最新版本。

Answer 2

上角CLI 1.5.0（角5）（通用）

测试当使用*ngIf="showSlider"与革命滑块此错误似乎上来。

基本上RS不喜欢其他东西从DOM中删除它，它有附件问题...在这种情况下，角度删除它，jQuery/RS有一点哭。

解决方法：

• 使用RS的API来摧毁它，然后让角做它的事。

很多方法可以做到这一点，这是我做的：

ngOnChanges() { 
    if (this.hideTheSlider === true && this.slider) { 
     // queries the conditional and if the 
     // slider already exists on the dom 

     // RS's kill switch 
     this.slider.revkill(); 

     // set the ngIf conditional for the html rewrite 
     this.sliderLive = false; 
     setTimeout(() => this.sliderLive = true, 100); 
    } 
} 

ngAfterViewInit() { 

    if (isPlatformBrowser(this.platform)) { // due to server side rendering check if browser 
     this.preloadImages(); 

     /* initialize the slider based on the Slider's ID attribute */ 
     setTimeout(() => this.slider = $(this.el.nativeElement).find('#rev_slider_1').show().revolution(this.getSliderOptions()), 10); 

    } 
}