Background transparent dans une iframe

Version imprimable

10/11/2011, 16h16
milarepa

Background transparent dans une iframe

Bonjour à tous,
Je suis en train de faire un petit site pour mon groupe de musique, lui aussi encore en création :-) http://err0r500.shadylane.fr
Il y a dans la section "téléchargements" (cliquez sur la flèche vers le bas dans la colonne de gauche) deux widgets bandcamp (site pour distribuer sa musique) qui sont inclus dans des iframes.
Sous chrome, pas de souci les fonds sont transparents par contre pour ce qui est de FF et d'Opera (l'autre affreux je m'en fous) le fond apparaît bleuté et je n'ai pas l'impression de pouvoir y avoir accès (ce qui est me semble logique dans une iframe cross-domain).
Je me dis qu'il y a peu de chances que cela vienne de Bandcamp qui est un site énorme.
Des idées pour résoudre ce souci sont les très bien venues!
Merci d'avance.
EDIT : avec un petit bout de code minimal, cela va tout de meme mieux! Voici le lien vers le bout de code inclus dans le site : http://err0r500.shadylane.fr/downloads.php
J'ai ajouté un bout de css pour mettre un fond noir et que le probleme soit ainsi visible.
11/11/2011, 09h55
NoSmoking

Bonjour,
il semblerait que le fond soit défini dans ton objet flash et non dans ton IFRAME.
essaies avec l'appel suivant
http://bandcamp.com/tmpdata/cache/Em...B&bgcol=000000
11/11/2011, 12h34
milarepa

Salut,
Merci pour ta réponse, j'avais déjà essayé trifouiller les paramètres mais rien y fait et je viens de voir que cela me fait pareil sur le site bandcamp lui-même quand je définis le widget.
J'ai mis à jour ma version de Flash, cela n'a rien changé.
Vu que je voulais essayer de limiter le flash au max sur mon site, je vais essayer autrement et laisser tomber leur widget.
Tiens, je vais essayer JPlayer, ça a l'air de bien marcher!

la seule chose finalement à faire me semble être de supprimer le transparent=true essaies pour voir

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[...]</title>
<style type="text/css">
iframe {
  width : 200px;
  height : 300px;
}
</style>
</head>
<body>
<iframe src="http://bandcamp.com/EmbeddedPlayer/v=2/album=1263591479/size=grande3/bgcol=FFFFFF/linkcol=4285BB/transparent=true/"></iframe>
<iframe src="http://bandcamp.com/EmbeddedPlayer/v=2/album=1263591479/size=grande3/bgcol=FFFFFF/linkcol=4285BB/"></iframe>
</body>
</html>

11/11/2011, 19h54
milarepa

Merci pour tes efforts, le résultat reste le même avec ton code mais par ailleurs je viens de recevoir un mail du support bandcamp qui me dit que le bug est connu et que même si ce n'est pas une de leurs priorités (sic) cela fait parti des "to-do".
Donc il ne reste qu'à attendre ou trouver une autre solution (je pense opter pour la seconde!)
Merci encore.
PS : je ne sais pas si je mets le problème en résolu...
11/11/2011, 20h19
NoSmoking

Citation:

Merci pour tes efforts, le résultat reste le même avec ton code mais par ailleurs je viens de recevoir un mail du support bandcamp qui me dit que le bug est connu et que même si ce n'est pas une de leurs priorités (sic) cela fait parti des "to-do".

certes mais je suis surpris que cela ne fonctionne pas pour toi, en supprimant transparent=true, le fond prend la couleur définie dans le paramètre bgcol, ce qui te permet de contourner le BUG, et ce sur tous les navigateurs que j'ai testé...

Citation:

PS : je ne sais pas si je mets le problème en résolu...

c'est comme tu le sens.
12/11/2011, 07h44
milarepa

Mais je le veux transparent mon fond! :)
Sinon, c'est clair que cela marche : avec une couleur donnée en bgcolor et sans transparence, pas de souci.
De toute manière, je peux pas saquer les iframes (je ne sais pas pourquoi) et en cherchant une solution alternative hier j'ai découvert les joies de l'ajax cross-domain. Je vais donc me faire mon petit lecteur, c'est plus marrant comme ça et je viens de découvrir que cela s'appelait un "mashup" (et pas une "content farm" comme le disait un pote pour se foutre de moi) et que c'est à la pointe de la coolitude du design web. :P Alors je vais essayer de le faire bien!