[Résolu] Questions Menu déroulant /opacité/IE7

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [Résolu] Questions Menu déroulant /opacité/IE7

toum_toum

Vivons masqués

... Et mes questions menu, les voici :

Je suis en train de créer un menu latéral, qui va se développer sur 3 niveaux (rubriques 1 à 5, sous-rubriques, et sous-sous rubriques), donc un étalement latéral assez important...

Avant ce menu, j'ai créé un bloc, avec des propriétés de transparence (bloc destiné à intégrer plus esthétiquement le menu dans le fond-image de la page). On va appeler ce bloc le bloc "contenant_menu"

Ce bloc "contenant_menu" ayant des propriétés de transparence (opacité = 40% par ex..), ces propriétés se transmettent aux éléments enfants, donc au menu. Très bien, ça m'arrange...

Par contre je souhaiterais que les noms des rubriques n'aient plus cette propriété de transparence, pour une meilleure lisibilité.
Comment faire ? (Je crois me souvenir que c'est un truc tout bête qui permet de désolidariser de l'élément-père - ou bien de faire perdre le caractère "bloc" -> le "display" peut-être... ?). Bref j'ai un trou de mémoire... [:panzani gino]

Mon autre question :

Comme je le disais, mon menu "s'étale" sur le côté (droit).

Pas de soucis, si ce n'est que, sous Internet Explorer, tout ce qui "sort" de mon bloc "contenant_menu" n'apparaît pas ! Donc le menu ne s'étale pas comme prévu, il reste limité par le bloc parent "contenant_menu".

Comment régler ça ? (sous Firefox aucu problème...)

Message cité 2 fois
Message édité par toum_toum le 05-05-2010 à 14:13:35

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Publicité

Skopos

Titilleur de nombrils...

toum_toum a écrit :

Par contre je souhaiterais que les noms des rubriques n'aient plus cette propriété de transparence, pour une meilleure lisibilité.
Comment faire ? ([b]Je crois me souvenir que c'est un truc tout bête qui permet de désolidariser de l'élément-père[/b] - ou bien de faire perdre le caractère "bloc" -> le "display" peut-être... ?). Bref j'ai un trou de mémoire... [:panzani gino]

Essaye la déclaration !important en fin de règle.

toum_toum a écrit :

Mon autre question :

Comme je le disais, mon menu "s'étale" sur le côté (droit).

Pas de soucis, si ce n'est que, sous Internet Explorer, tout ce qui "sort" de mon bloc "contenant_menu" n'apparaît pas ! Donc le menu ne s'étale pas comme prévu, il reste limité par le bloc parent "contenant_menu".

Comment régler ça ? (sous Firefox aucu problème...)

Une page test à donner ?

Message cité 1 fois
Message édité par Skopos le 28-04-2010 à 13:21:21

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

Skopos a écrit :

Essaye la déclaration !important en fin de règle.

Pas bête, mais je me dis que est-ce qu'au final j'ai besoin de l'utiliser ?

Si je définis une opacité de 100% juste sur mes éléments textes, ca devrait suffire en fait [:klemton] , non ?

Skopos a écrit :

Une page test à donner ?

Hélas je suis en local.

Bon vais voir pour mettre ça en ligne...

Edit :
Voilà : http://tiny.cc/nd6fl

Message édité par toum_toum le 29-04-2010 à 11:43:23

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

toum_toum

Vivons masqués

toum_toum a écrit :

(...)

Par contre je souhaiterais que les noms des rubriques n'aient plus cette propriété de transparence, pour une meilleure lisibilité.
Comment faire ? (Je crois me souvenir que c'est un truc tout bête qui permet de désolidariser de l'élément-père - ou bien de faire perdre le caractère "bloc" -> le "display" peut-être... ?). Bref j'ai un trou de mémoire... [:panzani gino]

Question 1 réglée

toum_toum a écrit :

Mon autre question :

Comme je le disais, mon menu "s'étale" sur le côté (droit).

Pas de soucis, si ce n'est que, sous Internet Explorer, tout ce qui "sort" de mon bloc "contenant_menu" n'apparaît pas ! Donc le menu ne s'étale pas comme prévu, il reste limité par le bloc parent "contenant_menu".

Comment régler ça ? (sous Firefox aucu problème...)

Me reste ce pb par contre...

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

toum_toum

Vivons masqués

Up!

La technologie utilisée pour le développement du menu est Spry (un truc Adobe, très voisin de scriptaculous), mais je pense que ça reste un simple probleme de bloc CSS... (entre le "bloc de fond" - celui en transparence - et les blocs-menus).

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Skopos

Titilleur de nombrils...

Si le JS et désactivé ils font comment les gens ?

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

Ben que ce soir Spry, scriptaculous, MooTools et consorts, je suis bien obligé de passer par l'un d'eux... donc...

Message cité 1 fois

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

rufo

Pas me confondre avec Lycos!

ton menu, faut pas avoir des pbs de vue, dit donc! C'est pas très lisible, mais bon, c'est peut-être pas terminé...

Pour les pbs entre Firefox (ou bon navigateur et IE), y'a le coup des filtres passe-haut, passe-bas, passe-bande, des hacks css en fait : http://centricle.com/ref/css/filters/

Message cité 1 fois

---------------
Astres, outil de help-desk GPL : http://sourceforge.net/projects/astres, ICARE, gestion de conf : http://sourceforge.net/projects/icare, Outil Planeta Calandreta : https://framalibre.org/content/planeta-calandreta

Skopos

Titilleur de nombrils...

toum_toum a écrit :

Ben que ce soir Spry, scriptaculous, MooTools et consorts, je suis bien obligé de passer par l'un d'eux... donc...

Le JS il doit venir le cas échéant en complément, pour apporter une amélioration ergonomique ou visuelle. Par exemple ici pour mettre un fondu d'animation ou aller chercher un aperçu du contenu ciblé.
Si sa désactivation empêche un truc aussi primordial que la navigation il faut revoir sa copie.

Au final c'est une sorte de menu déroulant horizontal que tu veux faire, pas besoin de JS dans l'absolu.

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

rufo a écrit :

ton menu, faut pas avoir des pbs de vue, dit donc! C'est pas très lisible, mais bon, c'est peut-être pas terminé...
C'est juste un squelette, le "remplissage" ne sera qu'en fin de travail, c'est donc moche

Pour les pbs entre Firefox (ou bon navigateur et IE), y'a le coup des filtres passe-haut, passe-bas, passe-bande, des hacks css en fait : http://centricle.com/ref/css/filters/
Dans les "No" pour IE6 et IE7, je ne vois rien en rapport avec mes scripts...

Je vais poursuivre mes inquisitions

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Publicité

toum_toum

Vivons masqués

Ca y est j'ai trouvé la cause du blocage [:icon3] (sans toutefois saisir pourquoi, et comment le résoudre).

En fait c'est mon bloc "contenant_menu", et très précisément ce qui est lié à ça :

Citation :

Ce bloc "contenant_menu" ayant des propriétés de transparence (opacité = 40% par ex..), ces propriétés se transmettent aux éléments enfants, donc au menu. Très bien, ça m'arrange...

En fait, si j'enlève ce que j'avais écrit pour avoir ma transparence, mon problème disparaît.

Le code incriminé est celui-ci :

#contenant_menu {
(...)
filter:alpha(opacity=30);
-moz-opacity:0.3;
-khtml-opacity: 0.3;
opacity: 0.3;
}

Ce sont ces 4 lignes qui font obstacle, sous IE, au développement de mon menu. Si j'enlève ces ligne, mon menu devient Ok !
:??:

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Skopos

Titilleur de nombrils...

hmm... problème à la con -> problème de hasLayout peut-être ?

Ajoute zoom: 1; après les 4 lignes pour voir.

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

Non, pas de changement.

Une observation : si je remets mon script précédent dont je parlais plus haut (effet "Spry" de fade/opacité),
ca repart également...

Le script :

Sur l'objet dans l'HTML :

Code :

onmouseover="MM_effectAppearFade('menu1', 1000, 30, 85, true)" onmouseout="MM_effectAppearFade('menu1', 1000, 85, 30, true)"

Dans le fichier .js :

Code :

Spry.Effect.Fade = function (element, options)
{
if (!this.notStaticAnimator)
return Spry.Effect.Utils.showInitError('Fade');
Spry.Effect.Cluster.call(this, options);
this.name = 'Fade';
var element = Spry.Effect.getElement(element);
this.element = element;
if (!this.element)
return;
var durationInMilliseconds = 1000;
var fromOpacity = 0.0;
var toOpacity = 100.0;
var doToggle = false;
var transition = Spry.fifthTransition;
var fps = 60;
var originalOpacity = 0;
if(/MSIE/.test(navigator.userAgent))
originalOpacity = parseInt(Spry.Effect.getStylePropRegardlessOfDisplayState(this.element, 'filter').replace(/alpha$opacity=([0-9]{1,3})$/g, '$1'), 10);
else
originalOpacity = parseInt(Spry.Effect.getStylePropRegardlessOfDisplayState(this.element, 'opacity') * 100, 10);
if (isNaN(originalOpacity))
originalOpacity = 100;
if (options)
{
if (options.duration != null) durationInMilliseconds = options.duration;
if (options.from != null){
if (Spry.Effect.Utils.isPercentValue(options.from))
fromOpacity = Spry.Effect.Utils.getPercentValue(options.from) * originalOpacity / 100;
else
fromOpacity = options.from;
}
if (options.to != null)
{
if (Spry.Effect.Utils.isPercentValue(options.to))
toOpacity = Spry.Effect.Utils.getPercentValue(options.to) * originalOpacity / 100;
else
toOpacity = options.to;
}
if (options.toggle != null) doToggle = options.toggle;
if (options.transition != null) transition = options.transition;
if (options.fps != null) fps = options.fps;
else this.options.transition = transition;
}
fromOpacity = fromOpacity/ 100.0;
toOpacity = toOpacity / 100.0;
options = {duration: durationInMilliseconds, toggle: doToggle, transition: transition, from: fromOpacity, to: toOpacity, fps: fps};
var fadeEffect = new Spry.Effect.Opacity(element, fromOpacity, toOpacity, options);
this.addNextEffect(fadeEffect);
};
Spry.Effect.Fade.prototype = new Spry.Effect.Cluster();
Spry.Effect.Fade.prototype.constructor = Spry.Effect.Fade;

Message cité 1 fois

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

toum_toum

Vivons masqués

C'est l'opacité qui fait péter un plomb à IE. Mais pourquoi ?...

(Car si je n'ai pas ce bloc "contenant_menu" en arrière-plan du menu, pas de soucis...)

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Skopos

Titilleur de nombrils...

toum_toum a écrit :

Non, pas de changement.

Une observation : si je remets mon script précédent dont je parlais plus haut (effet "Spry" de fade/opacité),
ca repart également...

Ca repart, c'est-à-dire que c'est bon, que tout marche comme prévu ?

Essaye de déclarer zoom:1; sur une ligne à part.

Code :

#contenant_menu {
zoom: 1;
}

Je connais le pb mais je maitrise pas vraiment le concept du hasLayout

Il semble bien y avoir un pb de haslayout avec l'opacité, regarde là-dedans :spamafote:
http://www.google.fr/search?q=hasl [...] =firefox-a

Message cité 1 fois

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

Skopos a écrit :

Ca repart, c'est-à-dire que c'est bon, que tout marche comme prévu ?

Non hélas. je parlais du bug qui repart

Skopos a écrit :

Essaye de déclarer zoom:1; sur une ligne à part.

Code :

#contenant_menu {
zoom: 1;
}

Je vais voir, moi aussi ça me dit qq chose ce haslayout je l'ai dejà vu.
Mais es-tu sûr que ca correspond à mon truc ? Moi l'opacité fonctionne. Le fade aussi.
C'est juste l'affichage de mon menu qui reste dans les limites du bloc placé derrière, juste du fait que cette propriété d'opacité existe - et même si à priori on pourrait penser que ça n'a rien à voir

(PS : merci pour ton aide)

Message édité par toum_toum le 01-05-2010 à 13:34:23

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

Skopos

Titilleur de nombrils...

De rien, par contre si tu pouvais quoter correctement ce serait bien parce que là par exemple si je veux quoter ton message c'est très chiant.

---------------
userstyles HFR : alléger l'accueil du forum; réduire les img https des quotes. Script AHK ImageFloodHFR

toum_toum

Vivons masqués

Re-salut,

J'ai remis en ligne mon probleme, réduit à sa plus simple expression : 2 malheureux petits blocs
l'un sur l'autre...

Cas 1 : rien dessus;
Cas 2 : une opacité sur le bloc de fond (le 1)
Cas 2 : plus d'opacité sur le bloc de fond (le 1), mais un comportement de fade in/fade out sur ce même bloc.

http://tinyurl.com/2dfv6tw

Donc pareil : sous FF, no soucis, sous IE (7), le bug... : le bloc 2 tronqué

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

toum_toum

Vivons masqués

J'ai réduit mon problème d'opacité sous IE à sa plus simple expression :

A) A gauche 2 blocs "normaux".
B) A droite les 2 blocs avec, pour le bloc 1, une opacité définie dans le CSS.
(Seule la première ligne est utile pour IE)

-> http://nsa14.casimages.com/img/201 [...] 644885.jpg

Et le résultat : l'opacité fonctionne, mais du coup le bloc 2 est tronqué (limité par les limites du bloc 1)...

Merci à celui ou celle qui trouverait un début de solution

---------------
“Never forget that England imposed this war on us" - Goebbels 1943 . “Et maintenant, la météo" - Soloviev 2023

FORUM HardWare.fr

Programmation

HTML/CSS

[Résolu] Questions Menu déroulant /opacité/IE7

Sujets relatifs
[Résolu] Lignes de code CSS venues de Saturne ?	[Résolu] Pertinence. MATCH/AGAINST
menu déroulant largeurs variables sans JS	[RESOLU]Plus de "insérer un commentaire" après la macro
[Résolu][php]récupération de données d'un fichier .txt	[Résolu] Bug: le texte est gros aléatoirement...
Menu "Cloud"	Macro oublie des cellules [Résolu]
Menu "animé" et très large. Flash ? Pas flash ?...
Plus de sujets relatifs à : [Résolu] Questions Menu déroulant /opacité/IE7

Page générée en 0.134 secondes