J'ai une fenêtre contextuelle sur mosueover. Quand il est placé dans une div avec un positionnement absolu, seule une partie de la popup apparaît. Mon jsfiddle est ici. Ceci est une suite à ma question here. Quand j'ai posté cette question, je n'ai pas réalisé que le code serait utilisé dans un div qui a déjà un positionnement absolu. Dans le correctif posté dans ce fil, vous pouvez voir les affichages de la fenêtre bien. Les seules différences entre celui-ci et mon nouveau code est l'addition des deux divs environnants. Ils ont des réglages de hauteur de 220px et je vois que c'est ce qui limite la popup mais je ne vois pas comment la réparer. Ces paramètres de hauteur initiale doivent rester tels qu'ils sont pour que je ne puisse pas les supprimer ou les modifier. Quelqu'un pourrait-il m'aider?Impossible d'afficher la hauteur maximale lorsque le positionnement absolu est utilisé
<style>
#ds-holder {
position: relative;
margin: 0 auto;
width: 300px;
height: 220px;
overflow: hidden;
}
.ds-container {
top: 0px;
left: 0px;
width: 140px;
height: 220px;
position: absolute;
overflow: hidden;
}
#dsspan{
background: none repeat scroll 0 0 #F8F8F8;
border: 5px solid #DFDFDF;
color: #717171;
font-size: 13px;
height: auto;
width: auto;
letter-spacing: 1px;
line-height: 30px;
margin: 0 auto;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 80px;
left:30px;
display:none;
padding:0 20px;
}
#dsspan:after{
content:'';
position:absolute;
bottom:-10px;
height:0px;
}
.ds {border:1px solid red}
.ds:hover #dsspan { display:block; }
</style>
<div id="ds-holder">
<div class="ds-container">
<div class="ds">
<span id="dsspan">
This line is longer than the rest.
<ul>
<li>Text</li>
<li>Text</li>
<li>Text</li>
<li>Text</li>
<li>Text</li>
</ul>
</span>
<a href="example.com">Hover Here</a>
</div>
</div>
</div>
Supprimer 'overflow: hidden' de' ds-holder' et 'ds-container'? – kukkuz
Cela a résolu le problème dans l'exemple. Malheureusement, je ne peux pas l'utiliser dans le code réel. Ce code utilise le curseur jssor pour afficher une image et le paramètre overflow doit être masqué. J'ai regardé beaucoup, beaucoup d'exemples sur le web et il semble que la seule façon de montrer un popup comme ceci est en utilisant le positionnement absolu. J'ai donc fini par utiliser un lien javascript pour ouvrir une boîte de dialogue. Cela fonctionne mais ne semble pas comme je veux, mais il permet le passage de la souris, donc je suppose que c'est le seul choix. Merci pour la suggestion, cependant. – user3052443