18041 sujets

Questions générales et questions de débutants

[Résolu] Redimention de videos sans html5

Bonjour,
Actuellement mes vidéos sont appelées ainsi:

<object class="video" data="wblog.swf" type="application/x-shockwave-flash">
<param name="flashvars" value="file=les-asf/wblog_casse_pipe_partout.flv&amp;image=les-asf/wblog_casse_pipe_partout.jpg" />
<param name="src" value="wblog.swf" /><param name="allowfullscreen" value="true" /></object>


avec en CSS

object.video {
width:720px;
height:576px;
}
/* ===puis ========== */
@media screen and (max-width:900px)
{
  object.video {
   width:600px !important;
   height:480px !important;
  }
} 

@media screen and (max-width:500px)
{
  object.video {
   width:400px !important;
   height:320px !important;
  }
}

la dimension se modifie bien, mais pas la vidéo elle même (donc une partie est cachée Smiley confused
bien sur tout mes éléments autres sont déplacés et redimensionnés parfaitement !

Merci d'avance de votre aide.
Modifié par Christele (11 Dec 2013 - 18:45)
Hello, je répond rapidement juste déjà pour préciser que la bonne syntaxe est !important et pas ! important (donc sans espace).
Merci à toi d'avoir regardé, j'ais corrigé, mais je sais que la tolérance permet l'espace.
Cependant autant étre rigoureux donc c'est corrigé, mais bien sur problème entier Smiley decu
Le problème vient de ton flash dans lequel ta vidéo devrait occuper 100% de la largeur et de la hauteur et pas une valeur fixe. Mais de toute façon faire du responsive avec du flash c'est complètement con vu que la moitié des tablettes et des smartphones ne lisent pas le flash. C'est comme faire un site full flash destiné aux utilisateurs d'iPad. Smiley lol
Modifié par jb_gfx (11 Dec 2013 - 19:57)
Salut,

Au lieu de chercher à redimensionner en CSS comme tu le fais, avec la multiplication des media queries en prime, cherche tout simplement à éviter que l'objet Flash ne dépasse de son conteneur, tout en gardant les proportions, ce qui se traduit en CSS par :
object.video {
  max-width: 100%;
  height: auto;
}

Et !important, quand on ne sait pas ce qu'on fait, c'est mal. Smiley cligne
Victor BRITO a écrit :
Salut,
Et !important, quand on ne sait pas ce qu'on fait, c'est mal. Smiley cligne


Si je sais ce que représente ce paramètre et à quoi il sert, juste saches que si je l'ais mis, c'est qu'il est nécessaire dans ce cas précis.
Par ailleurs, qu'as-tu contre le traitement par les media queries Smiley ohwell

Tu devrais lire les conseils de nos maîtres ici media query

Porter des jugements hâtifs est parfois signe de prétention mal placée.
Désolée , surtout que ta solution bien sur est loin de donner le résultat attendu.
Écoute, je n'ai rien contre les media queries, bien au contraire.

Pour le reste, je n'avais nullement l'intention d'être prétentieux dans mon précédent message et je suis désolé si tu l'as interprété ainsi. Et sache que la piste que j'ai évoquée est évoquée ici (même si height: auto n'y figure pas).

Si tu ne veux pas tenir compte de ce je dis, tiens au moins compte de la remarque pertinente de jb_gfx. Smiley cligne
Comme d'hab. Sur un fil de discussion sur trois, tu t'énerves que l'on te fasse remarquer que certaines choses que tu dit, écrit et propose ne sont pas justes et tu refuses de te remettre en question en pointant des ressources qui au mieux, ne servent pas tes propos ; au pire, disent plutôt l'inverse.

On est sur un forum, hein. C'est normal de discuter. Mais je peux aussi te dire que non, tout ne se vaut pas. Tu pourrais envisager de lire attentivement ce que les professionnels et amateurs éclairés ont à te dire de façon générale sur tes choix techniques parfois discutables et ne pas juste rester dans ton coin et ne garder que la solution à ton problème immédiat (et ne pas progresser dans ton apprentissage). A toi de voir.


[HS]
Arf, #800 : toussapourssa ^^'
Modifié par audrasjb (12 Dec 2013 - 11:16)
Pa de problèmes on en parle plus Smiley cligne
très bien ton lien, j'ai lu (je croyais) tout ses articles mais pas celui-ci !
Je testes le problème persiste malgré cela pfffff...
Merci encore à toi
Bonjour,

j'aimerais juste revenir sur une remarque de Victor Brito.
Victor BRITO a écrit :

[...]
Et !important, quand on ne sait pas ce qu'on fait, c'est mal. Smiley cligne


Entièrement d'accord ! D'ailleurs, Christele, tu devrais lire ce petit tutoriel. Smiley cligne
Modifié par jQzz (12 Dec 2013 - 16:19)
Oui Olivier, avis partagé.
Et ce qui me fait bien rire c'est que cela répond totalement à ma question, avec un tout petit CSS
qui doit utiliser bien sur " ! important " ce qui est du reste trés bien expliqué dans la video de Grafikart.

@jQzz , tu notera par rapport à ton intervention, que c'est pas de chance .... peut'étre un défault de jeunesse Smiley smile
Bon allez je plaisante

Solution

<style>
.videocontainer{
   width: 100%;
   height: 0;
   padding-bottom: 56.25%;
   overflow: hidden;
   position: relative;
 }
.videocontainer.r1{
   padding-bottom: 100%;
 }
.videocontainer iframe, .videocontainer embed, .videocontainer object{
  width: 100%!important; height: 100%!important;
  position: absolute;
  top: 0; left: 0;
 }
</style>

Avec bien sur dans l'objet ou l'iframe de youtube par exemple,
height=0 et whigt=100%
@Christele : Tu n'est pas obligé de réagir de cette façon à chaque fois que quelqu'un te fait une remarque pertinente sur ce forum. C'est ton choix de ne pas vouloir les entendre, mais ça ne justifie pas le fait de prendre les gens de haut...
Christele a écrit :

[...]

@jQzz , tu notera par rapport à ton intervention, que c'est pas de chance .... peut'étre un défault de jeunesse Smiley smile
Bon allez je plaisante

[...]


Pourquoi ?
Sujet clos
Aller à