更改离子幻灯片中的图像而不是按钮

Question

我正尝试在离子幻灯片组件中创建一些幻灯片，我需要的是更改幻灯片上的图像，但不是按钮或界面交互。无论如何，我可以实现这一目标吗？

非常感谢。

我的代码是这样的：

<ion-slides pager> 
<ion-slide style="background-image:url(../../assets/img/disco.jpeg)"> 
    <button ion-button round small>Entrar sin cuenta</button> 
    <div> 
    <h2>Todas las discotecas en la palma de tu mano</h2> 
    </div> 
    <div> 
    <button ion-button round small>Conéctate con Facebook</button> 
    </div> 
    <div> 
    <button ion-button round small>Crear cuenta</button> 
    </div> 
    <div> 
    <button ion-button round small>Crear cuenta</button> 
    </div> 
</ion-slide> 
<ion-slide style="background-color: green"> 
    <h2>Slide 2</h2> 
</ion-slide> 
<ion-slide style="background-color: green"> 
    <h2>Slide 3</h2> 
</ion-slide> 
<ion-slide style="background-color: green"> 
    <h2>Slide 4</h2> 
</ion-slide> 

Answer 1

的情况是，您使用的是幻灯片内的按钮，它会自动消失，当你改变你的幻灯片，您需要使用您的滑块外的按钮和绝对位置，以便滑过滑块。

<ion-slides pager> 
    <ion-slide style="background-color: green"> 
    <h2>Slide 2</h2> 
    </ion-slide> 
    <ion-slide style="background-color: green"> 
    <h2>Slide 3</h2> 
    </ion-slide> 
    <ion-slide style="background-color: green"> 
    <h2>Slide 4</h2> 
    </ion-slide> 
</ion-slides> 
    <div class="over-slider"> 
     <button ion-button round small>Entrar sin cuenta</button> 
     <div> 
      <h2>Todas las discotecas en la palma de tu mano</h2> 
     </div> 
     <div> 
      <button ion-button round small>Conéctate con Facebook</button> 
     </div> 
     <div> 
      <button ion-button round small>Crear cuenta</button> 
     </div> 
     <div> 
      <button ion-button round small>Crear cuenta</button> 
     </div> 
    </div> 

你的CSS

.over-slider{ 
    position: absolute; 
    top: 0; 
    left: 0; 
} 

你的CSS的其余部分是由你。

希望这会有所帮助。