OVH Cloud OVH Cloud

javascript et innerHTML

35 réponses
Avatar
yt.trash
j'ai une page d'essai qui me sert essentiellement à tester des svg.

par un js je cherche à changer l'innerHTML d'une div.

je fabrique l'innerHTML à partir d'un index représentant un des n svg à
visualiser :

function getInnerHTML(idx)
{
if (idx < 10) idx = "0"+idx;
html="<object
data='http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leaf
node_lock_opening_"+idx+".svg' type='image/svg+xml' ";
html+="width='600' height='600'>";
html+="<embed
src='http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafn
ode_lock_opening_"+idx+".svg' type='image/svg+xml' ";
html+="width='600' height='600' ";
html+="pluginspage='http://www.adobe.com/svg/viewer/install/' />";
html+="</object>";
return html;
}


j'ai mis l'adresse absolue dès fois que...

mais ça ne marche pas plus, le reste du script :

function findDOM(o_id)
{
if (document.getElementById)
{
return (document.getElementById(o_id));
}
if (document.all)
{
return (document.all[o_id]);
}
}
function openLock()
{
o=findDOM("svg_id");
if(o)
{
o.innerHTML=getInnerHTML(16);
alert(o.innerHTML);
}
}

window.onload=openLock;

ça n'a rien de spécial.

et pourtant ça ne marche pas :[

ce qui se passe :

je vérifie que le innerHTML de la div d'id = svg_id a bien changé par
alert(o.innerHTML);

mais, à l'écran, si je vois bien que le innerHTML et rechargé, il reste
cependant que ça ne s'affiche pas.

la page :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening.html>

le premier svg par défaut :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening_08.svg>

le second, après onload :

<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_
lock_opening_16.svg>


je ne pige pas ce qui se passe d'autant que la console js (je teste avec
firefox 2 version fr)...

si qq'un a une idée...

quan au moins un basculement de *08.svg vers *16.svg fonctionnera, je
pense ajouter un timer afin de vsualiser les 17 svg du dossier...
--
Une Bévue

10 réponses

1 2 3 4
Avatar
yt.trash
ASM wrote:


<http://yvon-thoraval.com/SVG/essais/leafnode_l
ock_opening_svg/leafnode_lock_opening.html>


Non ça marche pô !


avec ff si !

je viens de regarder avec webkit aussi.
--
Une Bévue

Avatar
yt.trash
ASM wrote:

Bien sur que si :

http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_2.html

Est-ce que tu ne pourrais pas virer les images :
- img/moving_png/lock_open_anim_08.png
- img/bord_new_600.png
de tes svg ?

J'ai comme l'impression que ça met la zone et alourdit inutilement
les chargements/mises en place.


ouais, pendant un temps ça ne marchait pas chez moi, depuis ça marche
mais j'avoue ne pas avoir compris pourquoi ça ne machait pas...

pourquoi dus-tu quaa ça alourdit inutilement, ça fait partie du svg, ce
que j'ai cherché à faire c'est commuter des svg, autrement une animation
interne au svg c'est plus facile à faire.

c'est un test d'un prog qui génère automatiquement les 17 svg, notamment
la couleur de fond où je teste l'algo hsv3rgb...
--
Une Bévue

Avatar
ASM
ASM wrote:
http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_2.html

Est-ce que tu ne pourrais pas virer les images :
- img/moving_png/lock_open_anim_08.png
- img/bord_new_600.png


ouais, pendant un temps ça ne marchait pas chez moi, depuis ça marche
mais j'avoue ne pas avoir compris pourquoi ça ne machait pas...


Heu ... javascript désactivé ? :-)

pourquoi dus-tu quaa ça alourdit inutilement, ça fait partie du svg, ce
que j'ai cherché à faire c'est commuter des svg, autrement une animation
interne au svg c'est plus facile à faire.


Bon depuis j'ai récupéré un de ces png.
Il n'est pas très gros c'est vrai.

N'empèche, lancer un truc qui échange des balises objects, qui appellent
un fichier SVG, qui appelle des PNG ... comme méthode tordue ...
Et en plus, le navigateur ne met sans doute pas grand chose de tout ça
dans son cache ?

Alors que le JS de nos grds parents arrive très bien à animer les png

voir ici:
http://stephane.moriaux.perso.wanadoo.fr/truc/yt/leaf_3.html
le petit cadenas en haut-droite
plus options pour rythmer le passage des grands objets
l'arreter ou le redémarrer.

c'est un test d'un prog qui génère automatiquement les 17 svg, notamment
la couleur de fond où je teste l'algo hsv3rgb...


Tu veux dire que les fichiers svg ne sont pas en dur ?
(me semble pourtant les avoir vus sur ton site)

Tu as lu les remarques d'Oliv' concernant ce script hsv/rgb ?


Pour en revenir à "leafnode_lock_opening" :
<http://yvon-thoraval.com/SVG/essais/leafnode_lock_opening_svg/leafnode_lock_opening.html>
j'ai regardé le JS ... pas simple ... dont compteur n'a pas l'air de
fonctionner ?

function changeUrl(url)
{
// if (idx < 10) idx = "0"+idx;
// Hou la Non ! malheureux !
// et qu'est ce que va comprendre le compteur ?
// idx lui appartient !

var idu = idx<10? '0'+idx : idx+'';
return url.substring(0,url.length-6)+idx+".svg";
}


--
ASM


Avatar
yt.trash
ASM wrote:

Heu ... javascript désactivé ? :-)


non, je ne désactive jamais js...


pourquoi dus-tu quaa ça alourdit inutilement, ça fait partie du svg, ce
que j'ai cherché à faire c'est commuter des svg, autrement une animation
interne au svg c'est plus facile à faire.


Bon depuis j'ai récupéré un de ces png.
Il n'est pas très gros c'est vrai.

N'empèche, lancer un truc qui échange des balises objects, qui appellent
un fichier SVG, qui appelle des PNG ... comme méthode tordue ...
Et en plus, le navigateur ne met sans doute pas grand chose de tout ça
dans son cache ?


bon le but était de tester comment switcher des svg, juste pour vérifier
les svg, c'est un outil c tout.

par ailleurs si j'échange des balises objets c'est parce que ça ne
marche pas autrement par exemple, si sur une image je change le src par
js pas de pb, mais sur un svg changer le data de object et/ou le src de
embed n'a rien donné chez moi, je trouve ça bizarre.

autrement, effectivement c'est plus simple de mettre du js dans le svg,
ça je sais faire mais ce n'était pas le but de la manip :

<http://yvon-thoraval.com/SVG/essais_anim/leafnode_lock_opening.svg>

là, c'est directement le svg qui est animé, à pat le cadenas qui
s'ouvre, il n'y a plus qu'une image "en dur" c'est disons le capot...
--
Une Bévue


Avatar
yt.trash
ASM wrote:

Tu veux dire que les fichiers svg ne sont pas en dur ?
(me semble pourtant les avoir vus sur ton site)


ben si, ils sont "en dur", générés par un script ruby puis transformés
en png avec le rasterizer de batik.


Tu as lu les remarques d'Oliv' concernant ce script hsv/rgb ?



non, j'ai qq doutes sur les algo fournis sur wikipedia...
mais bon j'ai mes versions ruby et aussi uniquement hsv2rgb.js en js.


Pour en revenir à "leafnode_lock_opening" :
<http://yvon-thoraval.com/SVG/essais/leafnode_lock_
opening_svg/leafnode_lock_opening.html>

j'ai regardé le JS ... pas simple ... dont compteur n'a pas l'air de
fonctionner ?


sisi, le compteur marche.
--
Une Bévue

Avatar
ASM

autrement, effectivement c'est plus simple de mettre du js dans le svg,
ça je sais faire mais ce n'était pas le but de la manip :

<http://yvon-thoraval.com/SVG/essais_anim/leafnode_lock_opening.svg>

là, c'est directement le svg qui est animé, à pat le cadenas qui
s'ouvre, il n'y a plus qu'une image "en dur" c'est disons le capot...


Ha oui, nettement mieux !

--
ASM

Avatar
yt.trash
ASM wrote:


Ha oui, nettement mieux !


ce n'est pas "mieux", ça n'a rien à voir...

c'est + facile d'ailleurs de scripter directement dans le svg...

je n'ai ths pas compris pourquoi quand j'ai :

<object data="my_url"...>
<embed src="my_url"... />
</object>

en faisant :

my_object.data="new_url";
my_embed .src="new_url";

ça ne marche pas comme on peut le faire pour une <img... />

une idée ???
--
Une Bévue

Avatar
ASM
ASM wrote:

Ha oui, nettement mieux !


ce n'est pas "mieux", ça n'a rien à voir...

c'est + facile d'ailleurs de scripter directement dans le svg...


Ce n'est pas ce qu'il y est fait ?
<script><![CDATA[


je n'ai ths pas compris pourquoi quand j'ai :

<object data="my_url"...>
<embed src="my_url"... />
</object>

en faisant :

my_object.data="new_url";
my_embed .src="new_url";

ça ne marche pas comme on peut le faire pour une <img... />

une idée ???


Pour la balise embed, AudioLive avait, et QuickTime devrait encore avoir
des possibilités javascript.

Les 2 approches assez voisines sont relativement tordues
et, bien sûr, ne sont possibles qu'avec le plug-in correspondant.
C'était l'époque où embed servait au son, à la vidéo.

Pour la balise object, j'ai cru voir qque part qque chose du genre :
monObject.contentdata = responseText;
(pas retrouvé dans mon coin de stockage)

Faut-il au préalable lancer la fonction Java (de Netscape) ?

Brefle : je sais pô.


Avatar
yt.trash
ASM wrote:


Ce n'est pas ce qu'il y est fait ?
<script><![CDATA[


si c'est ça + un script externe "hsv2rgb.js"

dans la balise svg : onload="init(evt)"

mais on peut faire de l'animation SANS javascript par ex :

<http://gilles.chagnon.free.fr/cours/xml/svgdynamique.html#modifattrib>

(timer incorporé à svg)

je n'ai ths pas compris pourquoi quand j'ai :

<object data="my_url"...>
<embed src="my_url"... />
</object>

en faisant :

my_object.data="new_url";
my_embed .src="new_url";

ça ne marche pas comme on peut le faire pour une <img... />

une idée ???


Pour la balise embed, AudioLive avait, et QuickTime devrait encore avoir
des possibilités javascript.

Les 2 approches assez voisines sont relativement tordues
et, bien sûr, ne sont possibles qu'avec le plug-in correspondant.
C'était l'époque où embed servait au son, à la vidéo.

Pour la balise object, j'ai cru voir qque part qque chose du genre :
monObject.contentdata = responseText;
(pas retrouvé dans mon coin de stockage)

Faut-il au préalable lancer la fonction Java (de Netscape) ?

Brefle : je sais pô.


ben tu me donnes une piste quand même :

- 1 - si j'ai mis embed à l'intérieur de object, c'est ce que j'ai lu
qqpart, chance pour qu'un nav ne sachant pas lire object passe à embed.

on peut y mettre à la place une imafe au lieu d'un svg ;

- 2 - je n'ai essayé que mon_objet.data... je vais farfouiller pour
voir...

parce que pour l'instant on ne peut pas faire de "inline svg" soit la
page est entièrement svg soit le svg est dans un object.

--
Une Bévue


Avatar
yt.trash
Une Bévue wrote:


- 2 - je n'ai essayé que mon_objet.data... je vais farfouiller pour
voir...


jai trouvé des pages qui parlent de ça, ils font comme toi...

pas vu, pour l'instant, de " monObject.contentdata = responseText;"
--
Une Bévue

1 2 3 4