curseur Slick, objet de position au-dessus diapositive absolue

Question

Je l'ai fait une JSFiddle expliquer ce que je voudrais faire avec toboggan lisse:

<div class="slider"> 
    <div> 
    <div class="absolute"> 
     Blabla 
    </div> 
    <img src="http://kenwheeler.github.io/slick/img/fonz1.png" /> 
    </div> 
    <div> 
    <img src="http://kenwheeler.github.io/slick/img/fonz2.png" /> 
    </div> 
</div> 

CSS

.absolute { 
    width: 100px; 
    height: 100px; 
    position: absolute; 
    top: -50px; 
    background-color: #900; 
} 

En bref: La boîte rouge la première diapositive est invisible car elle se trouve à l'intérieur de la diapositive qui a un débordement caché. J'ai besoin que la boîte fasse partie de la première diapositive seulement et bouge avec la diapositive.

Quelqu'un peut-il corriger l'exemple JSFiddle pour que cela fonctionne, ce serait très apprécié.

Answer 1

Fonctionne correctement. Assurez-vous que la case rouge doit être position & absolue et chaque curseur ont une position relative. de sorte que votre boîte rouge appartiennent à cette diapositive ne

.slider > div{ 
    position: relative; 
} 
.absolute { 
    width: 100px; 
    height: 100px; 
    position: absolute; 
    top: -50px; 
    background-color: #900; 
}