Bonjour,
j'ai un petit soucis avec une <div> -> overflow:auto,
en effet alors que ça fonctionne parfaitement sous IE, Google Chrome et Safari, il n'y a pas moyen de déplacer la barre de scroll sous firefox de manière continu.
Je m'explique sur le terme de continu, la seule façon de scroller le contenu de la div et de cliquer à côté du bouton de sroll sur la barre de scroll, on ne peut pas la faire glisser le bouton si non il emporte toute la <div>.
C'est franchement compliqué à expliquer et pour vous à comprendre donc je vous montre le soucis sur mon site:
1) vous allez sur www.funeralforamanga.com
2) vous cliquez sur "choix animés" en bas de votre écran
3) la boite s'affiche
4) essayer de vous servir de la scrollbar et vous aller mieux comprendre.
Alors voici les codes auxquelles est soumis cette <div>
Le code HTML
Le code CSS
Et enfin le code javascript:
Alors je suis quasiment sûr que le problème vient du display:none, seulement je peux pas l'enlever si non la boite est constamment afficher et mon javascript "cacher/afficher" ne sert plus à rien.
Pourriez vous s'il vous plait me dire ce qui cloche et comment y remédier s'il vous plait ?
PS : Je sais que mon code n'est pas correct du fait qu'un <table> et un <div> se trouvent dans un <a> et j'ai posé une question à ce propos >ici<
Modifié par Nheavy (20 May 2011 - 14:39)
j'ai un petit soucis avec une <div> -> overflow:auto,
en effet alors que ça fonctionne parfaitement sous IE, Google Chrome et Safari, il n'y a pas moyen de déplacer la barre de scroll sous firefox de manière continu.
Je m'explique sur le terme de continu, la seule façon de scroller le contenu de la div et de cliquer à côté du bouton de sroll sur la barre de scroll, on ne peut pas la faire glisser le bouton si non il emporte toute la <div>.
C'est franchement compliqué à expliquer et pour vous à comprendre donc je vous montre le soucis sur mon site:
1) vous allez sur www.funeralforamanga.com
2) vous cliquez sur "choix animés" en bas de votre écran
3) la boite s'affiche
4) essayer de vous servir de la scrollbar et vous aller mieux comprendre.
Alors voici les codes auxquelles est soumis cette <div>
Le code HTML
a écrit :
<a href="javascript:switchDisplay_2();" title="Afficher/cacher le menu choix animés">
<div id="cacherbo1" style="display:none;">
<div id="menuder" class="menuder">
<table><tr>
<td>
Contenu de tableau soumis à l'autoscroll
</td>
</tr>
</table>
</div>
</div>
</a>
Le code CSS
a écrit :
#cacherbo1{
background-image: url(http://s4.e-monsite.com/2011/05/20/12/Sans-titre-21.jpg);
position:fixed;
height: 127px;
width: 750px;
bottom: 36px;
left:70px;
z-index: 101;
}
#menuder, .menuder{
overflow:auto;
height: 109px;
width:730px;
margin:10px;
z-index: 110;
}
Et enfin le code javascript:
a écrit :
function switchDisplay_2(){
var defaut = document.getElementById('bo1');
var autre = document.getElementById('cacherbo1');
defaut.style.display = (defaut.style.display == '' ? '' : '');
autre.style.display = (autre.style.display == 'none' ? '' : 'none');
}
Alors je suis quasiment sûr que le problème vient du display:none, seulement je peux pas l'enlever si non la boite est constamment afficher et mon javascript "cacher/afficher" ne sert plus à rien.
Pourriez vous s'il vous plait me dire ce qui cloche et comment y remédier s'il vous plait ?
PS : Je sais que mon code n'est pas correct du fait qu'un <table> et un <div> se trouvent dans un <a> et j'ai posé une question à ce propos >ici<
Modifié par Nheavy (20 May 2011 - 14:39)