Frameset et lien multiple

Version imprimable

1 pièce(s) jointe(s)

Bonjour ,

Je cherche un moyen pour changer 4 frameset différentes ( url : 1,2,3,4 ) avec un lien commun.

C'est l'emboitement des frames qui pose un target different et ensuite comment activer 1 url par
target avec un seul click .

A+ pour des conseils

:)

Pièce jointe 395702
Code:

1 2 3 4 5 6 7 8 9 10 <li><a href="#" onclick="action7();">action</a></li> <script type="text/javascript"> function action7() { alert('casper'); top.frames['page7'].location.href = "http://google.fr"; };
Pas de résultat avec le code au dessus
La frame : page7 est ciblé mais sans le contenu "http://google.fr"

12/07/2018, 09h22
eleydet

Bonjour,

frameset... est obsolète!?
https://developer.mozilla.org/fr/doc...ement/frameset
23/07/2018, 10h19
bm

eleydet :

Bien , mais comment se partage iframe pour obtenir 4 pages réduites ?

:)
23/07/2018, 12h00
Watilin

Une navigation basée sur des iframes posera les mêmes problèmes qu’avec un frameset. Essentiellement, ces problèmes sont des obstacles à l’accessibilité de la page (à commencer par la navigation au clavier), qui sont la principale raison pour laquelle frameset a été déprécié.

Une solution plus moderne serait d’avoir la même page divisée en 4 <div> dont tu changes le contenu via ajax, par exemple avec la méthode .load() de jQuery.

Par curiosité : pourquoi as-tu besoin d’afficher 4 fois le même contenu ?

1 pièce(s) jointe(s)

Pièce jointe 398616

C'est une comparaison d'un profil de température
1-2-3-4 ( 2015-16-17-18 )

Réchauffement climatique
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>load demo</title> <style> body { font-size: 12px; font-family: Arial; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <b>Projects:</b> <ol id="new-projects"></ol> <script> var jour = 8; $( "#new-projects" ).load( "cd1.htm" ); </script> </body> </html>
Pas concluant ce stript, rien ne s'affiche et cd1.htm donne bien un graphique ...

:mrgreen:

23/07/2018, 16h05
Watilin

Ah d’accord, ce n’est pas 4 fois le même contenu, j’avais mal compris.

Tu as une raison particulière d’utiliser la version 1.10 de jQuery ? La dernière version en date est 3.3.1.

J’ai plusieurs hypothèses pour expliquer pourquoi ton script n’affiche rien.

1. Un problème d’apparence lié à la balise <ol>. Normalement tu devrais quand même voir quelque chose, même déformé, mais bon on ne sait jamais. Essaye avec <div> à la place.

2. Un problème de chemin. Assure-toi que cd1.htm est dans le même dossier que la page depuis laquelle tu testes.

3. Un problème de requête : si tu testes en local (protocole file:///) ou si en réalité tu demandes, sans l’avoir montré dans ton code, un fichier qui se trouve sur un serveur tiers, la requête .load() n’a pas lieu car la politique de même origine l’interdit.

Code:

$( "#new-projects" ).load( "cd1.htm" );

Est valable pour un fichier txt

Frame et Iframe , pas vraiment de différence en localhost
C'est aller chercher du content externe qui est bloqué par
des règles de sécurité ... ou de protection des data ...
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <!DOCTYPE html> <html> <body> <p>Click the button to change the location of the first iframe element (index 0).</p> <button onclick="myFunction1()">Try it</button> <br><br> <button onclick="myFunction2()">Try it</button> <br><br> <iframe src="https://www.w3schools.com" NAME="page8"></iframe> <iframe src="https://www.w3schools.com" NAME="page9"></iframe> <script> function myFunction1() { top.frames['page8'].location.href = "https://www.w3schools.com/jsref/"; } function myFunction2() { top.frames['page9'].location.href = "http://localhost/"; } </script> </body> </html>
Ci-dessus l'affichage de page8 est bloqué et
page9 est affiché

:yaisse2:

Bonsoir,

Il s'agit probablement d'un problème de contenu mixte.
https://developer.mozilla.org/fr/doc...mixte_site_web

En remarque, il est aussi possible d'écrire :
Code:

1 2 3 4 5 6 7 8 9 10 ... <iframe src="https://www.w3schools.com" id="page8"></iframe> <iframe src="https://www.w3schools.com" id="page9"></iframe> ... <script> function myFunction1() { document.getElementById('page8').src = "https://www.w3schools.com/jsref/"; } ...

Code:

1
2
3
4
5
6
7
function myFunction1() {
    //top.frames['page8'].location.href = "https://www.w3schools.com/jsref/";
    document.getElementById('page8').src = "http://www.lefigaro.fr/";
}
function myFunction2() {
    top.frames['page9'].location.href = "http://localhost/";
}

Les diffuseurs de news ne bloquent pas les Iframe avec l'entête http://

24/07/2018, 16h34
Watilin

Citation:

Envoyé par bm

Les diffuseurs de news ne bloquent pas les Iframe avec l'entête http://

Ce n’est pas complètement exact. En fait, c’est w3schools qui envoie un en-tête X-Frame-Options: SAMEORIGIN. Voir https://developer.mozilla.org/fr/doc...-Frame-Options.
24/07/2018, 18h06
bm

view-source:https://www.w3schools.com/

X-Frame n'est pas visible
24/07/2018, 21h28
Watilin

C’est un en-tête HTTP. On les voit dans l’onglet réseau de la console.
24/07/2018, 22h37
bm

Citation:

C’est un en-tête HTTP. On les voit dans l’onglet réseau de la console.

Quelle console et dans quel navigateur ?
24/07/2018, 23h16
Watilin

Le panneau d’outils de dev qui s’ouvre avec la touche F12. L’onglet s’appelle réseau ou network ou un truc comme ça.
Si l’outil réseau est actif lors du chargement de la page, tu verras apparaître une requête GET avec l’adresse de la page. Si tu cliques dessus tu peux voir les détails de la requête, dont les en-têtes HTTP.