11548 sujets

JavaScript, DOM et API Web HTML5

Désolé pour le titre, compliqué à rédiger.

Je m'explique : je souhaite faire défiler quelques pages pour une petite présentation.
Je souhaite également qu'en appuyant sur une lettre ou une des fleche par exemple, que je passe à la page suivante.

Ces pages sont dans un iframe, et je change le contenu de l'iframe toutes les x secondes (voir le code ci-dessous).

J'ai un pb tout con sous IE (ça marche sous FF) :
le fait que ce soit l'iframe qui prenne la totalité de l'espace visible implique que IE ne capture pas l'évenement de la touche à partir du script.
Bien évidemment je ne peux pas rajouter ce code de detection dans chacune des pages.
Comment puis-je faire à votre avis ?
Merci d'avance

var urls = new Array();
urls[urls.length] = 'http://..........';
urls[urls.length] = 'http://url2';
urls[urls.length] = 'http://url3';
var positionCourante = 0;

function tournante() {
    if (positionCourante >= urls.length) {
        positionCourante = 0;
    }
    document.getElementById('page').src = urls[positionCourante];
    positionCourante++;
    var timer = window.setTimeout("tournante();", 30000);
}

tournante();

function detectionTouche(Event)
{
    if(Event==null) {Event=event;}
    if (Event.keyCode == 37) {
        alert ('ici faire action sur fleche gauche');
    }
}

document.onkeypress = detectionTouche;

J'ai oublié le début de la page :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
	<title></title>
<body>

<iframe id="page" src="" width=1200 height=1000 scrolling="no" frameborder="no" marginwidth="0" marginheight="0"></iframe>

.....JS ici....
1) tu ne refermes pas ta balise "head" ?
2) chez moi, ça ne fonctionne pas non plus sous firefox, l'iframe à le focus et la vraie page ne detecte plus ses events.

edit: en fait, ça ne marche plus dès que l'iframe prend le focus .. exemple : site genre google et autres ayant un champs input autofocus. (pour firefox .. pas encore testé sous IE^^)
Modifié par bogs (23 Sep 2010 - 15:51)
Si, bien sûr, le head est refermé, j'ai oublié de le copier en nettoyant le code à poster.

Mais je confirme que ça marche pour moi sous firefox.
En fait j'ai compris : ça fonctionne tant que je n'ai pas cliqué sur la page en cours d'affichage.
Autrement dit, tant que c'est la page contenant le script qui a le focus, elle capture l'évenement, ce qui est assez logique.

Bref, je ne vois pas trop comment faire...
tu veux afficher des pages hébergées sur ton site ?

car si les pages dans l'iframe sont des pages de TON site, il devrait être facile de rajouter du javascript (même sans le rajouter sur chaque page, simplement depuis la page englobante !) (autrement ton navigateur t'en empêche pour des raisons de sécurité).
Ce ne sont pas des pages hébergées au même endroit, c'est pour ça que je ne peux pas rajouter le code dans chaque page...
rododo a écrit :
Ce ne sont pas des pages hébergées au même endroit, c'est pour ça que je ne peux pas rajouter le code dans chaque page...

en fait, je crois que c'est techniquement impossible de récupérer les évènements d'une iframe qui ne t'appartient pas ! et tant que l'iframe à le focus, ta page principale est considérée comme inactive. (comme quand tu ouvres plusieurs fenetres/onglets .. les key-events des autres fenêtres ne sont pas actifs non plus). donc le seul moyen serait de faire des window.focus() sur ta fenetre principale .. mais dans ce cas, ça poserait des problèmes pour la navigation des sites contenu dans les iframes comme par exemple écrire dans des champs input .. à moins que ton but n'est uniquement que de les visionner sans interagir ?

autre solution, serait eventuellement de copier les sites que tu veux framer via un proxy php et ainsi les heberger sur ton serveur .. bref, je ne vois pas de réelle solution pour toi. désolé.