2010-08-28 6 views
7

J'ai un élément conteneur div qui a overflow:hidden dessus. Malheureusement, cette propriété est nécessaire en raison de la façon dont le site est fait.CSS/JavaScript - contenu en dehors d'un élément avec débordement: caché

A l'intérieur de ce div c'est tout le contenu du site, y compris quelques info-bulles. Ces info-bulles sont affichées avec jQuery lorsque vous passez la souris sur un lien ou quelque chose.

Le problème est que certains de ces infobulles afficheront partiellement caché en raison de la chose de trop-plein au-dessus, parce qu'ils sont positionnés à l'extérieur du conteneur div ...

Est-il possible d'être en mesure de montrer un élément spécifique de l'intérieur de ce conteneur, même si elle est hors de ses limites? Peut-être une solution javascript?

le code html ressemble à ceci:

<div style="overflow:hidden; position:relative;"> 

    the main content 

    <div style="position:absolute;left:-100px;top:-50px;"> the tooltip thing </div> 

</div> 

Répondre

5

essayez ceci:

<div style="position:relative;">  
    <div style="overflow:hidden; position: relative; width: {any}; height: {any};">the main content<div>  
    <div style="position:absolute;left:-100px;top:-50px;"> the tooltip thing </div>  
</div> 

il suffit de placer votre contenu principal à un autre div dans la div principale et donne fourni pour cacher la css contenu si débordement ...

+0

De plus, ' margin: 0px; padding: 0px' sur le div contenant permettra de s'assurer qu'il n'y a pas de changement visible d'être là –

+0

Ajout juste "débordement: aucun" & "position: relative" a bien fonctionné pour moi –

0

si overflow: hidden doit contenir des flotteurs, alors il existe d'autres moyens qui permettraient de ne pas être infobulles coupés. regarder ennemi clearfix: après

Questions connexes