IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

changement opacité sous Chrome


Sujet :

JavaScript

  1. #1
    Membre à l'essai
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    32
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 32
    Points : 18
    Points
    18
    Par défaut changement opacité sous Chrome
    Bonjour,
    j'ai un petit diaporama avec fondu enchainé qui utilise "opacity" ; il marche sous FF (avec style.opacity) et IE (avec filters.alpha.opacity) mais pas sous Chrome qui semble pourtant utiliser opacity comme FF...
    Savez-vous comment changer l'opacité d'une image sous Google Chrome ??

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 057
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 057
    Points : 44 589
    Points
    44 589
    Par défaut
    Citation Envoyé par pseudodejautilis Voir le message
    Bonjour,
    j'ai un petit diaporama avec fondu enchainé qui utilise "opacity" ; il marche sous FF (avec style.opacity) et IE (avec filters.alpha.opacity) mais pas sous Chrome qui semble pourtant utiliser opacity comme FF...
    Savez-vous comment changer l'opacité d'une image sous Google Chrome ??
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    oImg.style.opacity  = 0.5;
    doit marcher...

    Fondu de test

  3. #3
    Inactif  

    Profil pro
    Inscrit en
    Mai 2010
    Messages
    345
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2010
    Messages : 345
    Points : 496
    Points
    496
    Par défaut
    Citation Envoyé par pseudodejautilis Voir le message
    Bonjour,
    j'ai un petit diaporama avec fondu enchainé qui utilise "opacity" ; il marche sous FF (avec style.opacity) et IE (avec filters.alpha.opacity) mais pas sous Chrome qui semble pourtant utiliser opacity comme FF...
    Savez-vous comment changer l'opacité d'une image sous Google Chrome ??
    poste ton code s'il te plait

  4. #4
    Membre à l'essai
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    32
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 32
    Points : 18
    Points
    18
    Par défaut
    Citation Envoyé par NoSmoking Voir le message
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    oImg.style.opacity  = 0.5;
    doit marcher...

    Fondu de test
    ben non, ça marche pas...
    en fait j'applique le même code à tous les navigateurs sauf IE :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    if (isIE)
    	{
    	opacity1 = parseFloat(img1.filters.alpha.opacity);
    	opacity2 = parseFloat(img2.filters.alpha.opacity);
    	}
    else
    	{
    	opacity1 = parseFloat(img1.style.opacity);
    	opacity2 = parseFloat(img2.style.opacity);
    	}
    ensuite je fais varier l'opacité :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
     
    if (isIE)
    	{
    	img1.filters.alpha.opacity = opacity1 - coef * 100;
    	img2.filters.alpha.opacity = opacity2 + coef * 100;
    	}
    else
    	{
    	img1.style.opacity = opacity1 - coef;
    	img2.style.opacity = opacity2 + coef;
    	}
    (et enfin je rappelle la fonction après un TimeOut)

    ça marche sur IE et Firefox, les images s'enchainent en fondu, mais sur Chrome les photos ne s'affichent même pas !

  5. #5
    Inactif  

    Profil pro
    Inscrit en
    Mai 2010
    Messages
    345
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2010
    Messages : 345
    Points : 496
    Points
    496
    Par défaut
    On n'a pas assez de code sous la main là. S'il te plaît poste un peu plus de code, car oui, ici c'est du code tout bateau que tu nous donne.
    Regardes toutes les questions que je me pose en voyant le peu d'éléments que tu nous donnes.
    - le isIE il est calculé comment ?
    - le code HTML associé il est où ?
    - Le code Javascript de la fonction qui met l'opacité (toute la fonction) il est où ?
    - le code javascript de tout cet ensemble il est où ?
    - Il y a un code CSS associé ? Si oui, y-a-t-il de l'opacité déjà appliqué sur ces éléments depuis la CSS ?

    C'est incroyable que les gens qui ont un problème ne postent jamais tout ce qu'il faut pour que nous comprenions leur problème

  6. #6
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 057
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 057
    Points : 44 589
    Points
    44 589
    Par défaut
    à vu de nez je supprimerais les parseFloat, car si opacity n'est pas défini cela te retournera NaN, et NaN +/- quelque chose fera toujours NaN.

    Néanmoins suit les conseils de dukej

  7. #7
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Points : 91 220
    Points
    91 220
    Billets dans le blog
    20
    Par défaut
    Citation Envoyé par NoSmoking
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    oImg.style.opacity  = 0.5;
    doit marcher...

    Fondu de test
    Citation Envoyé par pseudodejautilis
    ben non, ça marche pas...

    Si, ça marche ! (Voir l'exemple proposé), du moins si oImg correspond à quelquechose...
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  8. #8
    Membre habitué Avatar de xess91
    Homme Profil pro
    Inscrit en
    Octobre 2008
    Messages
    408
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : Octobre 2008
    Messages : 408
    Points : 193
    Points
    193
    Par défaut
    Bonsoir à tous,

    Voila 11 jours que la dernière réponse à été déposer, mais je viens tout de même faire ma contribution...

    J'utilise sur plusieurs de mes sites des fadeIn et fadeOut il se trouve que j'ai étrangement des erreurs sous google chrome que je n'avais pas avant.

    J'affirme que quelque chose a changer, pour l'instant je ne sais pas quoi mais je vais le trouver.

    A suivre...

  9. #9
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 057
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 057
    Points : 44 589
    Points
    44 589
    Par défaut
    Citation Envoyé par xess91
    J'utilise sur plusieurs de mes sites des fadeIn et fadeOut il se trouve que j'ai étrangement des erreurs sous google chrome que je n'avais pas avant.
    l'exemple de Bovino fonctionne très bien sous Chrome 9.0.597.98

  10. #10
    Expert éminent sénior

    Homme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2010
    Messages
    5 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Septembre 2010
    Messages : 5 389
    Points : 10 422
    Points
    10 422
    Par défaut
    ...et sous cette dernière version (9.0.597.98), des scripts que j'ai programmé avant même l'existence de Chrome continuent de très bien fonctionner.

  11. #11
    Membre habitué Avatar de xess91
    Homme Profil pro
    Inscrit en
    Octobre 2008
    Messages
    408
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : Octobre 2008
    Messages : 408
    Points : 193
    Points
    193
    Par défaut
    Je reviens donner une réponse par apport au fait que mes fades ne fonctionnaient plus sur chrome...alors...après des tests j'ai remarqué que sur un fadeOut de - 0.1 chrome retournait successivement 1 -> 0.9 -> 0.80000009 -> etc...

    Donc obligé d'utiliser .toFixed(1) sinon l'opacité n'atteignait jamais une valeur 0.

    Voilà voila pourquoi j'ai cru que opacity ne fonctionnait plus, et bien ça fonctionne mais la soustraction ne s'opérait plus comme avant.

    Bizar, bizar....de toute façon ça ne coûte rien d'utiliser systématiquement .toFixed(1) pour être sûr de la valeur retournée.

    Bonne continuation.

  12. #12
    Membre à l'essai
    Profil pro
    Inscrit en
    Mars 2005
    Messages
    32
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mars 2005
    Messages : 32
    Points : 18
    Points
    18
    Par défaut
    Désolé pour mon silence prolongé mais une surcharge de travail m'a obligé à laisser de côté mon site web...
    Bien vu xess91, le problème de mon diaporama sur Chrome venait de là : l'opacité n'atteignait jamais 0, pb réglé avec .toFixed(1). Merci à toi, je marque le post comme "Résolu" (bien que mon fondu soit moins fluide sur Chrome que celui de NoSmoking)

  13. #13
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 057
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 057
    Points : 44 589
    Points
    44 589
    Par défaut
    Citation Envoyé par pseudodejautilis Voir le message
    Merci à toi, je marque le post comme "Résolu" (bien que mon fondu soit moins fluide sur Chrome que celui de NoSmoking)
    c'est gentil mais rendons à Bovino ce qui lui appartient http://www.developpez.net/forums/d88...ondu-enchaine/
    pourquoi dans ce cas ne pas l'utiliser, ne dis rien je sais....

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [phpMyAdmin] Problème au changement de database sous Chrome
    Par peterken dans le forum EDI, CMS, Outils, Scripts et API
    Réponses: 0
    Dernier message: 19/04/2011, 11h47
  2. Réponses: 1
    Dernier message: 25/07/2007, 23h02
  3. Réponses: 11
    Dernier message: 02/05/2007, 08h56
  4. opacité sous IE
    Par Matgic95 dans le forum Général JavaScript
    Réponses: 7
    Dernier message: 12/02/2007, 11h01
  5. Réponses: 3
    Dernier message: 15/06/2006, 16h43

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo