11521 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Appel de SVG par <object>

Bonjour,
il me manque une logique qui ne me permet pas de résoudre un problème avec l'appel de mes SVG

Je voudrais disposer de 
<button>
qui permettrait de lancer 
<object>
sur chaque page correspondante (ce sont des fichiers SVG) et ainsi faire défiler les pages une à une.

En restant le plus basique possible -)

Merci de vos pistes Smiley cligne
----------------
<HTML>
<BODY>
<button onclick="xxx()">1</button>

<button onclick="xxx()">2</button>

<button onclick="xxx()">3</button>


<object id="viewFR" data="PAGE_x.svg"    width="800"        type="image/svg+xml" 	>
 </object>
</BODY>
<HTML>
Modérateur
Bonjour,

Tu y étais presque.

Il suffit de modifier la valeur de l'attribut data avec la fonction xxx(). Et aussi, il faut ajouter aux boutons l'attribut "type" avec la valeur "button" (c'est mieux de prendre cette habitude).

Un code possible :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
function xxx(n)
{
	var e=document.getElementById("viewFR");
	switch(n)
	{
		case 1:e.setAttribute("data","1.svg");break;
		case 2:e.setAttribute("data","2.svg");break;
		case 3:e.setAttribute("data","3.svg");break;
	}
}
</script>
<button type="button" onclick="xxx(1)">1</button>
<button type="button" onclick="xxx(2)">2</button>
<button type="button" onclick="xxx(3)">3</button>
<hr>
<object id="viewFR"
		data="1.svg"
		width="50%"
		type="image/svg+xml"
>
</object>
</body>
<html>

Amicalement,
Modifié par parsimonhi (06 Oct 2020 - 14:27)
Merci ,parsimonhi

Il me manquais le : 
setAttribute("data"


Mes prochains déboires risquent d'être l'adaptation aux tailles d'écrans Smiley cligne

Merci encore pour le coup de main Smiley cligne
Sujet clos
Aller à