Lien sur même page

borchiwoun Messages postés 8 Date d'inscription vendredi 14 décembre 2007 Statut Membre Dernière intervention 10 avril 2019 - 5 mars 2012 à 16:42
borchiwoun Messages postés 8 Date d'inscription vendredi 14 décembre 2007 Statut Membre Dernière intervention 10 avril 2019 - 2 avril 2012 à 18:19
Bonjour à tous,

Je travaille sur un site qui est composé de 2 frames :
- une en haut : composé d'un swf qui fait office de menu
- une en bas : qui est modifiée en fonction des liens selectionnés dans le SWF du haut.

Jusqu'ici tout va bien.

Sauf que lorsque je souhaite intégrer un lien dans ma frame du bas vers une autre frame, alors celle-ci s'ouvre dans une autre fenêtre seule, et je perd le bandeau de menu swf du haut.

J'ai tenté différentes solutions en vain :
J'ai tenté des [iframe_2.html LIEN]


</html>

6 réponses

cs_jperre Messages postés 268 Date d'inscription lundi 9 janvier 2006 Statut Membre Dernière intervention 19 janvier 2017 2
6 mars 2012 à 11:44
Si je comprend bien vous avez deux dans la même page. Et vous voulez afficher une page dans le deuxième à partir d'un lien contenu dans la page affichée dans le premier .
Pour cela, il faut passer obligatoirement par la page mère.
1 Dans la page mère, il faut donner une valeur à l'attribut id du deuxième
(ex id="iframe2").

2 Dans la section <head> de la page origine du lien qui est contenue dans le premier , ajouter le code suivant :
<script type="text/javascript">
function changeURL(url)
{
parent.getElementById("iframe2").src=url;
}
</script>

3 Modifier le l'attribut href du lien dans la page origine :
[javascript:changeURL('fichierCible.html') Lien]

Voilà, c'est terminé.

Attention!
Ce code ne fonctionnera pas sur Google Chrome si votre fichier n'est pas placé sur un serveur Web car une sécurité interdit à une page fille d'intervenir sur une page mère.
0
borchiwoun Messages postés 8 Date d'inscription vendredi 14 décembre 2007 Statut Membre Dernière intervention 10 avril 2019
6 mars 2012 à 20:18
Merci beaucoup pour ta réponse.

J'ai du rater un truc parce que je n'arrive pas à obtenir le résultat escompté.

Je ne suis pas certain d'avoir bien compris sur quelle page placer les différents codes.
Tu parles de :
de la page origine du lien qui est contenue dans le premier ,
de l'attribut href du lien dans la page origine.

J'ai :
Une page index (composée d'un swf en haut et iframe_0.html en bas)
Une page iframe_0.html qui apparait dans ma page index (en bas)
Une page iframe_2.html qui correspond à la page vers laquelle je veux aller depuis mon iframe_0.html

J'ai tenté en mettant :
1 sur ma page index.html :
<script type="text/javascript">
function changeURL(url)
{
parent.getElementById("iframe22.html").src=url;
}
</script>

2 sur ma page iframe_0.html :
[javascript:changeURL('iframe22.html') Lien]

Au niveau du lien, il ne devrait pas y avoir de soucis, mais ça ne fonctionne pas.

Comme je ne maîtrise pas le javascript j'ai aussi tenté de mettre sur toutes mes pages dans la section head, le code suivant, mais rien n'a fonctionné:
<script type="text/javascript">
function changeURL(url)
{
parent.getElementById("iframe22.html").src=url;
}
</script>


Je n'ai pas de doutes sur le fait que ça peut marcher, ça doit venir de moi...

Merci pour les précisions que tu pourrais m'apporter.
0
cs_jperre Messages postés 268 Date d'inscription lundi 9 janvier 2006 Statut Membre Dernière intervention 19 janvier 2017 2
6 mars 2012 à 21:09
L'explication que j'ai faite concerne 3 pages HTML :
1 La page index.html contient deux
le premier d'attribut id= "iframe1" affiche la page iframe_0.html

le deuxième d'attribut id ="iframe2" affichera la page iframe22.html


2 la page iframe_0.html contient à la fois la fonction changeURL() et le lien qui permet d'afficher la page iframe22.html

Votre erreur vient du fait que vous avez mis le code dans la page index.html. Cela ne peut pas marcher pour les deux raisons suivantes :
--> d'une part, la fonction se trouvant dans la page index.html est inconnue dans la page iframe_0.html
--> d'autre part, le lien appelant la fonction se trouve dans la page iframe_0.html, il est donc inconnu dans la page index.html,
--> et enfin la fonction changeURL() fait référence à l'élément avec id="iframe2" de la feuille parent or index.html est la feuille parent, elle ne possède pas de parent.


J'aurais pu vous proposer de créer la fonction dans la page index.html, mais dans ce cas le code aurait été complètement différent :
function changeURL(url) {
document.getElementById("iframe2").src =url;
}

et le lien dans la page iframe_0.html serait :
[javascript:parent.changeURL('iframe22.html') lien]
0
borchiwoun Messages postés 8 Date d'inscription vendredi 14 décembre 2007 Statut Membre Dernière intervention 10 avril 2019
8 mars 2012 à 18:49
J'ai tenté pas mal de choses avant de reposter sur le forum et le fait est que je n'arrive toujours pas le faire fonctionner.

Est-ce qu'il n'y a pas un conflit dans les id avec les éléments déjà présent dans le head de ma page contenant le lien d'origine (iframe_0.html) vers ma page de destination (iframe_22.html) ? Ou le fait qu'il y'ai plusieurs balises <script> et que je doivent les regrouper dans une seule ?

Ci-dessous la matérialisation de ce que j'ai compris de ton message :
iframe_0.html :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>x</title>
<meta name= "keywords" content="x" />
<meta name="description" content="x" />

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link href="style.css" rel="stylesheet" type="text/css">
<script type="text/javascript"> 
function changeURL(url) 
{ 
parent.getElementById("iframe22.html").src=url; 
} 
</script>
<script language="JavaScript" type="text/JavaScript">
function load_content () {
if (parent.document.getElementById('main_div')) {
parent.document.getElementById('main_div').innerHTML=document.getElementById('inner_frame').innerHTML;
}
if (!parent.document.getElementById('main_div')) {
window.location=('index.html');}
}
</script>
    <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'xxx']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga document.createElement('script'); ga.type 'text/javascript'; ga.async = true;
    ga.src ('https:' document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</head>




[javascript:parent.changeURL('iframe_22.html')   ] 



</html>



[b]iframe_22.html :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>x</title>
<meta name="keywords" content="x" />
<meta name="description" content="x" />

<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Untitled</title>
<link href="style.css" rel="stylesheet" type="text/css">
   
<script src ="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script language="JavaScript" type="text/JavaScript">
function load_content () {
if (parent.document.getElementById('main_div')) {
parent.document.getElementById('main_div').innerHTML=document.getElementById('inner_frame').innerHTML;
}
if (!parent.document.getElementById('main_div')) {
window.location=('index.html') ;
}
}
</script>
    <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'xxxx']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga document.createElement('script'); ga.type 'text/javascript'; ga.async = true;
    ga.src ('https:' document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>


</head>



<table width="721" border="0" cellpadding="0" cellspacing="0" style="height:100% ">
----, <object classid=\"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000\" width=\"726\" height=\"320\" id=\"FlashID\" >

<object type=\"application/x-shockwave-flash\" data=\"flash/xx.swf\" width=\"726\" height=\"320\">

Le contenu de cette page nécessite une version plus récente d'Adobe Flash Player.

<script type=\"text/javascript\">
swfobject.registerObject(\"FlashID\");
</script>

</html>


[b]index.html :
<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">
<html>
<head>
<title>x</title>
<meta name=\"keywords\" content=\"x\" />
<meta name=\"description\" content=\"x\" />
<meta http-equiv=\"content-type\" content=\"text/html; charset=UTF-8\"><meta name=\"google-site-verification\" content=\"xx\" />
<link rel=\"shortcut icon\" type=\"image/x-icon\" href=\"images/Logooo123.ico\" />

<link href=\"style.css\" rel=\"stylesheet\" type=\"text/css\">
<script type=\"text/javascript\">
function changeURL(url) {
document.getElementById(\"main_div\").src=url;
}
</script>
<script type=\"text/javascript\">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'xxxx']);
_gaq.push(['_trackPageview']);

(function() {var ga document.createElement('script'); ga.type 'text/javascript'; ga.async = true;ga.src ('https:' document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>
</head>

<table cellpadding=\"0\" cellspacing=\"0\" border=\"0\"  align=\"center\">
----

<table cellpadding="0" cellspacing="0" border="0">
----,
<object classid=\"clsid:DXXXDB6E-AXXD-11cf-9XX8-4445000000000\" codebase=\"http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0\" width=\"726\" height=\"300\">

<!--[if !IE]> <-->
<object data=\"flash/header.swf\"
width=\"726\" height=\"300\" type=\"application/x-shockwave-flash\">

FAIL (the browser should render some flash content, not this).
</object>
<!--> <![endif]-->
</object>			  </td>


</html>



Merci à nouveau par avance pour ton aide.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
cs_jperre Messages postés 268 Date d'inscription lundi 9 janvier 2006 Statut Membre Dernière intervention 19 janvier 2017 2
8 mars 2012 à 22:22
S'il y a bien une chose qui ne risque pas de fonctionner c'est bien le montage emboîté d'éléments <script>. IL EST INTERDIT D'INSERER UN ELEMENT SCRIPT DANS UN AUTRE ELEMENT SCRIPT. A partir de la balise d'ouverture de l'élément <script type="text/javascript"> (l'attribut language="javascript" est inutile et déconseillé) VOUS NE DEVEZ TROUVER QUE DU CODE JAVASCRIPT JUSQU'A LA RENCONTRE DE LA BALISE DE FERMETURE </script>. D'autre part votre page index.html ne connaît que les éléments qu'elle contient, elle les connaît par leurs attributs id. Par contre, le contenu des feuilles qui sont affichées dans ces est totalement étranger à la page index.html. Il ne peut donc y avoir de confusion même si des éléments viendraient à porter le même id dans chacune des feuilles.
0
borchiwoun Messages postés 8 Date d'inscription vendredi 14 décembre 2007 Statut Membre Dernière intervention 10 avril 2019
2 avril 2012 à 18:19
Un grand merci à jperre, je n'ai pas réussi à m'en sortir malgré tes explications très claires, mais il devait y avoir autre chose qui génait..(moi peut être..) en tout cas j'ai enfin la solution qui est simplissime, alors je voulais en faire profiter tout le monde, car depuis le temps que j'ai posé la question soit presque 1 mois je n'ai pas arrêtter de chercher une solution que voici :
il suffit d'ajouter 'target="cont" '

Exemple :

[iframe_4.html go to contact page]

Sujet pouvant être clos.

Merci à tous.
0
Rejoignez-nous