Ouvrir un iframe à partir d'un bouton

Fermé
Elise - 12 juil. 2019 à 17:37
 raisedead - 13 juil. 2019 à 15:26
Bonjour,

Je voudrais intégrer une vidéo hébergée sur Facebook sur mon site. J'aimerai que la video s'affiche après un clique sur un bouton, à la manière d'une lightbox. Je ne veux pas que le lien me dirige sur facebook.
J'ai pris le code à intégrer, mais je ne sais pas où l'ajouter au code de mon bouton... quelqu'un peut m'aider?
Comment intégrer la balise <iframe> à un bouton?

Le code du bouton:
[button color="default" link="http://yourwebsite.com/example/" size="default" target="lightbox" block="false"]Button Text...[/button]

1 réponse

Bonjour,
un bouton ne peut rien intégrer, il sert à appuyer dessus. Par contre vous devez créer (lors de l'événement clic sur le bouton)une iframe(à moins qu'elle n'existe déjà) , indiquer son contenu et intégrer celle ci à la page.
C'est possible avec Javascript:

Détecter un événement et y relier une action(dans la fonction):

https://www.w3schools.com/jsref/met_element_addeventlistener.asp
Dans l'exemple donné remplacé le changement de texte par :

créer une iframe(en remplacant button par iframe):
https://www.w3schools.com/jsref/met_document_createelement.asp

puis remplir les éventuels contenu et attributs de l'iframe
pour le contenu
https://www.w3schools.com/jsref/prop_html_innerhtml.asp
pour les attributs
https://www.w3schools.com/jsref/met_element_setattribute.asp

et bien sûr ajouter l'ensemble(iframe avec contenu et attributs renseignés) à la page(sans oublier d'utiliser le sélecteur correct pour l'emplacement prévu)
https://www.w3schools.com/jsref/met_node_appendchild.asp

explication sur es sélecteurs en Javascript:
https://www.zonecss.fr/cours-css-javascript/les-selecteurs-javascript.html

voilà en suivant et modifiant les exemples vous pouvez vous en sortir et vous aurez des rudiments de programmation.

ps.: cela ne marche que si le contenu facebook est public, il y a aussi le propre langage facebook pour plus de possibilités, pour ça il faut s'inscrire sur facebook developper.
ps.: pas génial de passer par un intermédiaire, pourquoi ne pas mettre sur votre hébergeur votre vidéo? quitte à mettre un lien avec un bouton j'aime facebook sur la page.
0