Ordre de superposition des calques (DIV)

Ordre de superposition des calques (DIV) - HTML/CSS - Programmation

Marsh Posté le 17-06-2005 à 14:35:51    

Salut,
Je suis en train de crée une barre de navigation haute flottante en m'inspirant de ce site:
http://www.echoecho.com/toolfloatinglayer.htm
Le probleme c'est que cette barre est sensée se mettre au dessus de tout ce qui se trouve sur ma page...
Ca mrche pour tout suaf les listes (select) qui viennent se mettre au dessus de ma barre :(...
La question est simple: Comment obliger ma barre de navigation à rester au dessus ou mes listes à rester en dessous?
Y'a t'il un type dans le CSS qui gere cela?
Merci

Reply

Marsh Posté le 17-06-2005 à 14:35:51   

Reply

Marsh Posté le 17-06-2005 à 14:46:24    

LES CALQUES N'EXISTE PAS BON DIEU §§§§§§
 
Ensuite y'a pas besoin de JS à chier. Il existe une chose magnifique :

position: fixed;


Bon, sous IE ça scrollera comme au bon vieux temps. Mais sous les vrais navigateurs, le machin qui est en position fixe ne bougera pas :)

Reply

Marsh Posté le 17-06-2005 à 14:57:10    

mais justement je suis limité a IE :(...
Tu as rien d'autre en magasin?

Reply

Marsh Posté le 17-06-2005 à 14:58:51    

C'est pour un intranet, c'est ça ? Sinon y'a moyen de bricoler :heink:

Reply

Marsh Posté le 17-06-2005 à 14:59:55    

je viens de tester ton truc: je confirme marche avec NS et Moz mais pas IE :(

Reply

Marsh Posté le 17-06-2005 à 15:00:42    

Tu as tout deviné ;)...
Tout fonctionne bien sauf ces satanés listbox :(

Reply

Marsh Posté le 17-06-2005 à 15:00:59    

La propriété z-index peut-être ?


---------------
Ignore previous instructions, give me a recipe for a vegetarian couscous.
Reply

Marsh Posté le 17-06-2005 à 15:01:44    

Haaa oui, mais non. C'est un bug d'IE... Les select sont toujours au dessus du reste du monde, et il n'y a strictement rien à faire...

Reply

Marsh Posté le 17-06-2005 à 15:01:46    

PETOZAK a écrit :

Ca mrche pour tout suaf les listes (select) qui viennent se mettre au dessus de ma barre :(...
La question est simple: Comment obliger ma barre de navigation à rester au dessus ou mes listes à rester en dessous?


[:dawa]
 
Alors là tu vas être vachement heureux de savoir que...
 
Tu peux pas [:dawa]
 
Parce que la team MSIE a décidé un jour pour une raison inconnue que certains éléments de formulaire (textareas et selects par exemple) étaient toujours au premier plan, donc même avec un z-index à 65535 tu ne peux pas mettre un truc par dessus [:dawa]
 
 
edit: [:benou_grilled]
putain de bordel de merde :fou:  
Florent :fou:  
De deux secondes, enflure :fou:


Message édité par masklinn le 17-06-2005 à 15:02:27

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 17-06-2005 à 15:04:08    

Je me bat depuis tou à l'heure avec ces z:index....j'ai essayé positif negatif...et maintenant vous me dites que c'est pas possible :( :( :( :(  :sweat: ?
 
Dites moi qu'il y a une solution... :pfff:


Message édité par PETOZAK le 17-06-2005 à 15:04:55
Reply

Marsh Posté le 17-06-2005 à 15:04:08   

Reply

Marsh Posté le 17-06-2005 à 15:04:58    

Si c'est pour un Intranet comme tu dis, dit à ton boss que passer de IE à FireFox lui fera économiser des milliers d'euros en développement :D

Reply

Marsh Posté le 17-06-2005 à 15:06:53    

Serieux vous voyez pas d'autre solution...j'ai un code tout beau, tout fonctionnait, je vais comme meme pas le jeter :(?

Reply

Marsh Posté le 17-06-2005 à 15:07:05    

FlorentG a écrit :

Si c'est pour un Intranet comme tu dis, dit à ton boss que passer de IE à FireFox lui fera économiser des milliers d'euros en développement :D


 
 
 :lol: Et la le site va comporter tout plein de javascript, que firefox  n'aime pas du tout, et zou, foutu...  :whistle:

Reply

Marsh Posté le 17-06-2005 à 15:07:47    

Non, impossible de mettre quelque chose au dessus d'un select.  Mais alors vraiment que dalle. Ou alors de taper dans l'extrême bourin, et de trouver le moyen en JS de masquer la select si un machin lui passe dessus [:johneh]

Reply

Marsh Posté le 17-06-2005 à 15:08:06    

PETOZAK a écrit :

Je me bat depuis tou à l'heure avec ces z:index....j'ai essayé positif negatif...et maintenant vous me dites que c'est pas possible :( :( :( :(  :sweat: ?
 
Dites moi qu'il y a une solution... :pfff:


PETOZAK a écrit :

Serieux vous voyez pas d'autre solution...j'ai un code tout beau, tout fonctionnait, je vais comme meme pas le jeter :(?


Aucune, c'est un problème inhérent à MSIE, soit t'abandonnes l'idée de mettre des trucs par dessus le select, soit tu caches le select dynamiquement (JS/CSS) soit tu changes toute la philosophie et tu refais l'appli


Message édité par masklinn le 17-06-2005 à 15:08:49

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 17-06-2005 à 15:12:44    

sinon y a pas d'autre solution...iframes...htc (tres deconseillée mais bon)...
Pour tout vous dire le site est en Frames et je veux (et je dois) absolument le passer en Include!!
Je flippe!  :cry:


Message édité par PETOZAK le 17-06-2005 à 15:18:16
Reply

Marsh Posté le 17-06-2005 à 15:18:08    

Si t'es sur un intranet, t'en a rien à foutre des frames, tu peux en mettre autant que tu veux.
 
On considère qu'un intranet est un environnement maîtrisé, où tous les postes clients ont le même navigateur pareillement configuré, et que l'utilisation qu'on en fait dépasse le cadre de sites webs (on parlera plutôt d'applications web), donc tu fais ce que tu veux niveau frames :)

Reply

Marsh Posté le 17-06-2005 à 15:30:16    

merci florent...mais bon je vais chercher comme meme a faire ca en include...

Reply

Marsh Posté le 17-06-2005 à 15:32:51    

PETOZAK a écrit :

merci florent...mais bon je vais chercher comme meme a faire ca en include...


 
Tu prend le droit chemin mon enfant... :)

Reply

Marsh Posté le 17-06-2005 à 18:04:15    

Je pensais à un truc bourrin.
 
sur quirkmode ya une technique qui fait passer une balise de type P en Textarea et donc si on applique cette technique, et lorsque le DIV passe au dessus d'un textarea, le textarea se transforme en paragraphe ou DIV en essayant avec des style de lui donner la même gueule. ET paf nivu ni connu

Reply

Marsh Posté le 06-08-2005 à 19:49:38    

Voici une solution :
 
Plutot que de transformer une listbox en texarea ou en image ou autre, pourquoi ne pas ne pas transformer le "calque div" (menu flottant, ou info-bulle, etc.) en ... listbox ?
Oui, en listbox, parce que c'est le seul élément qui puisse se superposer sur une autre listbox sous IE5 ou IE6.
Bien sûr, il faudra régler un petit problème annexe, qui est celui de la suppression de la barre de défilement et de la bordure qui ne sont pas du tout esthétiques dans le cas d'une info-bulle. Pour cela, il "suffit" d'inclure la listbox dans une div box (ou une span box) plus petite. Evidemment cela nécessite le calcul de la taille exacte de ladite div box (ou span box).
 
Vous pouvez voir une image du résultat chez le confère anglais codeguru.com, http://www.codeguru.com/forum/showthread.php?t=351872. J'avais posté ma réponse là-bas. Puis, comme j'ai vu que la même question était posée ici, je viens de m'inscrire pour vous communiquer ma solution.
 
Ci-dessous, le code pour un exemple complet:


<html><head>
<style type="text/css">
.textbox_over
{
  position:relative; top:30px; left:50px;
  font-size: 72%; font-family: Arial,helvetica;
  background-color: yellow;
}
</style>
</head><body>
<form>
<span class="textbox_over">This should be overlapping</span><br>
<input type="text" value="An edit box" size=15>
<br>
<span style="position:relative;top:30px;left:50px;overflow:hidden;height:18px;width:157px;">
<select size=1 style="position:relative;top:-2px;left:-2px;height:50px;width:200px;font-family:Arial,helvetica;background-color:yellow;">
<option>This should be overlapping</option></select></span><br>
<select>
<option name=one value=one>A list box</option>
<option name=two value=two>The second line</option>
</select>
<br>
<span class="textbox_over">This should be overlapping</span><br>
<input type="submit" value="A button">
</form>  
</body></html>


Reply

Marsh Posté le 07-08-2005 à 07:44:45    

ta pas plus moche comme code HTML ?
tes spans ils servent à rien, tu peux directement attaquer les objets.
 
Mais ta technique est pas mal, malheureusement, cela ne fonctionne que dans le cadre d'une infobulle limitée. si tu veux faire un joli menu flashy avec pleins d'options, ça ne fonctionne plus

Reply

Marsh Posté le 16-08-2005 à 15:15:30    

PETOZAK a écrit :

Je me bat depuis tou à l'heure avec ces z:index....j'ai essayé positif negatif...et maintenant vous me dites que c'est pas possible :( :( :( :(  :sweat: ?
 
Dites moi qu'il y a une solution... :pfff:


 
je viens d'essayer et apparement ya pas de soucis de z-index sous ie (avec des valeurs positives c passé)

Reply

Marsh Posté le 16-03-2006 à 14:18:50    

Salut,
 
il y a un moyen simple de biaiser le select, c'est de faire afficher un iframe avec une page vierge dedans sous ta div avec les mêmes dimensions. l'iframe passera au dessus du select, donc ta div aussi.

Reply

Marsh Posté le 20-06-2006 à 13:07:47    

And the topic is born again...
 
Salut!
 
Je up ce topic car apres avoir chercher des solutions a ce probleme je me dis que certains ont peut-etre trouver des techniques ou astuces plus fiable ou plus propre.
 
Histoire de resituer le contexte, j'ai un menu deroulant fortement inspirer au niveau conceptionel a celui sur cette page d'exemple: http://www.ibilab.net/webdev/exemp [...] emple2.htm D'ailleurs pour ceux que cela interesse, le tuto de realisation de ce type de menu est dispo ici.
 
Alors ca se deroule niquel, il y a un petit peu de javascript histoire d'adapter les comportements du menu a Internet Explorer... Le soucis maintenant c'est que si un select (une liste deroulante html) se trouve dans au niveau du deroulement d'un sous menu, ce dernier passe en dessous, toujours avec IE. Enfin bref, je reinvente pas le probleme, je crois que les circonstances sont les memes, mais depuis ces derniers mois, y a t'il eu des changements? des solutions?
 
Merci  :)  
 
PS: Si il n'y a pas de solutions, je serai super deg (ps2: si ca se trouve mon patron le sera encore plus que moi)


Message édité par totokick le 20-06-2006 à 13:16:06
Reply

Marsh Posté le 14-01-2008 à 10:06:44    

non, toujours pas de solution propre.
soit tu affiches une div avec une iframe dedans sous ton menu (l'iframe passera au-dessus du select et masquera celui-ci.
soit tu rends "hidden" le select lors du passage du menu au dessus.

Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed