Demande d'aide sur un code HTML

par Solid6Snake Mar 6 Oct 2015 - 8:12

Détails techniques

Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://www.entraide-youtubers.com/

Description du problème

Bonjour, suite à un tuto sur never utopia j'ai récupéré un code fiche de présentation pour mon forum que je règle à ma manière sauf que je bloque sur un dernier point.. le remplacement des images par un vidéo!

http://test-fyraliel.forumactif.org/h2-presentationngnl

J'ai créé une nouvelle page HTML c'et bon et le code est dedans ça fonctionne mai je n'arrive pas à retirer les logos de bases pour les remplacer par un iframe vidéo youtube.

Le code:

Code:: <div style="height: 1742px; width: 550px; background: #141414; padding-top: 7px;"> <div style="height: 1730px; width: 530px; background: #A09E9E; margin-left: 7px; border: 3px solid #CACACA; text-align: center; font-size: 10px;"> <img style="height: 240px; width: 530px; border-bottom: 3px solid #CACACA;" src="http://wosape.free.fr/saigneur/v5.png" /> <div style="height: 20px; width: 530px; background: #808080; border-bottom: 3px solid #CACACA; margin-top: -4px; text-align: center; font: 'arial'; font-size: 13px; font-style: italic; color: #FFFFFF; padding-top: 5px"> La chaîne de PM 3D à l'honneur </div><img style="border: 3px solid #B9B8B8; margin: 25px 0 0 25px;" src="http://r30.imgfast.net/users/3017/31/01/68/avatars/835-32.png" /> <div style="height: 320px; width: 250px; background: #B3B3B3; border: 3px solid #CACACA; vertical-align: top; display: inline-block; margin: 25px 0 0 15px"> <div style="height: 20px; width: 250px; border-bottom: 1px solid #CACACA; background: #808080; font-family: 'arial'; font-size: 18px; text-align: center; color: #545454;"> FICHE D'IDENTITE </div> <div style="height: 140px; width: 250px; overflow: auto; font-family:'Arial'; font-size: 10px; color: #545454; line-height: 2; text-align: left;"> ♦ <strong>Nom de chaîne </strong>: ici <br />♦ <strong>Type de chaîne </strong>: ici <br />♦ <strong>Nombre d'abonnés </strong>: ici<br />♦ <strong>Membre YT depuis le</strong>: ici<br />♦ <strong>Nombre de vues </strong>: ici<br />♦ <strong>Site Web </strong>: ici </div> <div style="height: 20px; width: 250px; border-bottom: 1px solid #CACACA; background: #808080; font-family: 'arial'; font-size: 18px; text-align: center; color: #545454;"> "QUI ES-TU ?" </div> <div style="height: 140px; width: 250px; overflow: auto; font-family:'Arial'; font-size: 10px; color: #545454; line-height: 2; text-align: left;"> ♦ <strong>Prénom </strong>: ici<br />♦ <strong>Pseudo </strong>: ici<br />♦ <strong>Age </strong>: ici<br />♦ <strong>Messages </strong>: ici<br />♦ <strong>localisation </strong>: ici<br />♦ <strong>Groupe </strong>: ici </div> </div> <div style="height: 320px; width: 250px; background: #B3B3B3; border: 3px solid #CACACA; vertical-align: top; display: inline-block; margin: 25px 0 0 25px"> <div style="height: 20px; width: 250px; border-bottom: 1px solid #CACACA; background: #808080; font-family: 'arial'; font-size: 18px; text-align: center; color: #545454;"> DESCRIPTION CHAINE </div> <div style="height: 300px; width: 250px; overflow: auto; font-family:'Arial'; font-size: 12px; color: #545454; text-align: justify;"> PM 3D Animation est spécialisée dans la conception, la création de projets en 3D en tout genre en utilisant les logiciels SketchUp pour la modélisation principale du projet (structures, décors...), Lumion pour les rendus avec l'application de lumières, textures, personnages, animation et Sony Vegas pour faire le montage pour rendre le projet plus vivant avec de la musique et des ambiances sonores. Les projets sont purement fictifs et sont conçus à partir de différents thèmes comme : l’architecture, la vie actuelle, la science fiction, le cinéma ou le jeu vidéo. Ils s'articulent aux travers d'un scénario de fond en y intégrant parfois un concept architectural, mettant en exergue, pour certains projets, des scènes particulières. </div> </div><img style="border: 3px solid #B9B8B8; margin: 25px 0 0 15px; display: inline-block;" src="http://i.imgur.com/2o30Aoy.png" /><img style="border: 3px solid #B9B8B8; margin: 25px 0 0 25px;" src="http://image.noelshack.com/fichiers/2015/29/1436915946-nogamelifevava2.png" /> <div style="height: 320px; width: 250px; background: #B3B3B3; border: 3px solid #CACACA; vertical-align: top; display: inline-block; margin: 25px 0 0 15px"> <div style="height: 20px; width: 250px; border-bottom: 1px solid #CACACA; background: #808080; font-family: 'arial'; font-size: 18px; text-align: center; color: #545454;"> Hotel The Island [Projet 3D] </div> <div style="height: 300px; width: 250px; overflow: auto; font-family:'Arial'; font-size: 12px; color: #545454; text-align: justify;"> Hôtel The Island est un concept architectural d'un hôtel de luxe situé sur une île accessible uniquement par voie maritime. Le projet a été réalisé sur SketchUp 15 et Lumion 5. Le concept fictif de ce projet était d'imaginer un hôtel sur une île avec une construction en forme de plateaux rocheux sur plusieurs niveaux pour donner l'illusion que l'hôtel aurait été sculpté dans un rocher. Les plateaux possèdent des formes différentes et seront placés dans des axes différents afin de donner un effet d'escalier hélicoïdal. Tous les niveaux sont recouverts de végétations pour que l'hôtel se fond ainsi dans le paysage et lui donner un coté nature. Les niveaux sont complètement vitrés pour donner aux clients une vue panoramique sur l'ensemble de l'île et ses environs. Les niveaux chambres disposent d'une terrasse et d’une piscine suspendue avec jardin. L'hôtel disposera de deux plages aménagées via des box privés liés aux chambres des clients. </div> </div> <div style="height: 320px; width: 250px; background: #B3B3B3; border: 3px solid #CACACA; vertical-align: top; display: inline-block; margin: 25px 0 0 25px"> <div style="height: 20px; width: 250px; border-bottom: 1px solid #CACACA; background: #808080; font-family: 'arial'; font-size: 18px; text-align: center; color: #545454;"> Lumion | 70 [Projet 3D] </div> <div style="height: 300px; width: 250px; overflow: auto; font-family:'Arial'; font-size: 12px; color: #545454; text-align: justify;"> 70 est un projet survival/post-apocalyptique réalisé sur SketchUp 15 et Lumion 5. Dans ce projet je devais donner l’illusion d’être dans la peau d’une personne, un survivant qui marche dans un monde détruit, suite à une catastrophe dont la cause restera inconnue. La végétation ayant repris ses droits, les villes sont devenues de grandes forêts luxuriantes et abondantes. Marchant dans différents tableaux, sans savoir ou aller cette personne ne peut que constater ce que son monde est devenu et le désespoir ne fait que l’envahir. En voyant régulièrement le chiffre 70 sur son chemin, elle décide de suivre ces indications et de s’y rendre sans savoir ce qui pouvait l’attendre. </div> </div><img style="border: 3px solid #B9B8B8; margin: 25px 0 0 15px; display: inline-block;" src="http://img15.hostingpics.net/pics/979639Etwahlava.png" /><a href="http://www.never-utopia.com/"></a> </div> </div>

Par exemple ce genre d'image:

Demande d'aide sur un code HTML 8pj8

A remplacer par une vidéo Youtube..

Après ça le reste je sais pour le cadre et tout ça c'est bon mais là je bloque j'ai essayé ça décale tout à chaque fois et sans mettre l'iframe youtube rien ne s'affiche de toue façon.

Help, ça fait plusieurs jours que je suis dessous !

par Automne Mar 6 Oct 2015 - 10:44

Coucou,

Tu veux remplacer cette image
<img style="border: 3px solid #B9B8B8; margin: 25px 0 0 25px;" src="https://2img.net/u/3017/31/01/68/avatars/835-32.png" />

par une vidéo. Le mieux c'est d'utiliser la balise générique <object>. Tu récupères le lien de la vidéo dans l'iframe que te donne youtube puis tu le places dans la balise objet avec du style css

Code:: <object type="text/html" data="https://www.youtube.com/embed/Bt6clk4LNRk" style="width:235px;height:320px;margin-top:24px; border: 3px solid rgb(202, 202, 202);"> </object>

par Solid6Snake Mar 6 Oct 2015 - 12:31

Sympa de répondre merci et oui c'est ce code que je souhaite remplacer.

OK je test ce soir et je reviens ici pour donner des nouvelles Wink

par Solid6Snake Mer 7 Oct 2015 - 8:08

Automne a écrit:Coucou,

Tu veux remplacer cette image
<img style="border: 3px solid #B9B8B8; margin: 25px 0 0 25px;" src="https://2img.net/u/3017/31/01/68/avatars/835-32.png" />

par une vidéo. Le mieux c'est d'utiliser la balise générique <object>. Tu récupères le lien de la vidéo dans l'iframe que te donne youtube puis tu le places dans la balise objet avec du style css
Code:
<object type="text/html" data="https://www.youtube.com/embed/Bt6clk4LNRk" style="width:235px;height:320px;margin-top:24px; border: 3px solid rgb(202, 202, 202);"> </object>

Automne je te remercie 1000 fois ça fonctionne parfaitement avec l'rul dans l'frame Youtube franchement un grand merci à toi cheers

par **Chacha** Mer 7 Oct 2015 - 10:17

Solid6Snake a écrit:

Automne je te remercie 1000 fois ça fonctionne parfaitement avec l'rul dans l'frame Youtube franchement un grand merci à toi

..	Bonjour, Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à : éditer votre premier message, cocher l'icône Et enregistrer en cliquant sur Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton A bientôt sur ForumActif