Page accueil accès plusieurs sites

Fermé

lemask Messages postés 4 Date d'inscription jeudi 8 janvier 2009 Statut Membre Dernière intervention 15 novembre 2012 - 12 nov. 2012 à 17:39
lemask Messages postés 4 Date d'inscription jeudi 8 janvier 2009 Statut Membre Dernière intervention 15 novembre 2012 - 15 nov. 2012 à 18:30

Bonjour à tous,
Voici l'objectif que je me suis fixé.
Ma page html contient les liens pour accéder à plusieurs sites web.
J'ai placé un tableau dans le code html (2 lignes 4 colonnes). Les cellules de la 2ième ligne (bas) sont fusionnées. J'ai introduit un iframe dans celle-ci. Cet iframe doit afficher un texte contenu dans une autre page html "menutxt.html". Dans cette page 4 ancres sont positionnées.
Chaque cellule de la 1ère ligne du tableau (4) contient une image.
Je dois créer 2 évènements :
1 - survol (onMouseover) d'une image provoquant l'affichage du paragraphe correspondant du texte dans l'frame
2 - Clic sur une image ouvre une page html dans un nouvel onglet.

Je dois modifier mon script initial qui fonctionne bien mais qui ne correspond pas par celui défini ci-dessus.
Quelqu'un peut-il m'aider
Cordialement

Voici mon code actuel :

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Loisirs créatifs</title>
<link href="css/menu.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="container">
<div class="content">
<div style="position: relative; top: 410px; left: 500px; width: 300px; height: 200px;">
<table width="300" align="center">
<tr>
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="txt/menutxt.html#a1" target="txt"><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>
<td width="68" height="75" align="center" valign="middle" scope="col"><a href="txt/menutxt.html#a2" target="txt"><img src="img/pot1.png" alt="" width="62" height="75"></a></td>
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="txt/menutxt.html#a3" target="txt" ><img src="img/art1.png" alt="" width="62" height="75"></a></td>
<td width="92" height="75" align="center" valign="middle" scope="col"><a href="txt/menutxt.html#a4" target="txt"><img src="img/cart1.png" alt="" width="92" height="75" ></a></td>
</tr>
<tr>
<td height="210" colspan="4" align="left" valign="top"><iframe align="top" height="210" width="300" frameborder="0" name="txt" scrolling="no" ></iframe></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

A voir également:

Page accueil accès plusieurs sites
Mettre google en page d'accueil - Guide
Supprimer une page word - Guide
Page d'accueil iphone - Guide
Sites de téléchargement - Accueil - Outils
Pourquoi google me bloque l'accès de certain sites ? - Guide

5 réponses

Réponse 1 / 5

Freedomsoul Messages postés 509 Date d'inscription lundi 9 mai 2011 Statut Membre Dernière intervention 17 avril 2013 97
13 nov. 2012 à 16:31

je dirais :

Pour le OnMouseOver :

(a mettre dans les balises <a> )
OnMouseOver="document.getElementbyid('TestIframe').src='tonlien';"

et rajouter id="TestIframe" dans la balise iframe

Pour le OnClick:

(a mettre dans les balises <a> )
OnClick="window.open('tonlien');"

Réponse 2 / 5

lemask Messages postés 4 Date d'inscription jeudi 8 janvier 2009 Statut Membre Dernière intervention 15 novembre 2012
13 nov. 2012 à 19:36

Bonjour,
Merci pour ta prompte réponse.
Je vais testé la modification.
Cordialement

Réponse 3 / 5

lemask Messages postés 4 Date d'inscription jeudi 8 janvier 2009 Statut Membre Dernière intervention 15 novembre 2012
14 nov. 2012 à 18:52

Bonjour,

Mes tentatives de modification du script sont infructueuses.
Je n'ai pas réussi à intégrer les deux évènements dans le script.
L'utilisation de Javascript implique peut-être une déclaration dans l'entête de la page ?
Voici la partie que j'ai modifié et qui fonctionne :
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="lartsencadre.fr/index.html" OnClick='return !window.open(this.href);' ><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>
Mais comment compléter par onMouseOver !
Cordialement

Réponse 4 / 5

Freedomsoul Messages postés 509 Date d'inscription lundi 9 mai 2011 Statut Membre Dernière intervention 17 avril 2013 97
Modifié par Freedomsoul le 15/11/2012 à 08:36

Arf, désolé, c'est ma faute, c'est getElementById et non getElementbyid

<!DOCTYPE HTML>  
<html>
<head>  
<meta charset="utf-8">  
<title>Loisirs créatifs</title>  
<link href="css/menu.css" rel="stylesheet" type="text/css">  
</head>  
<body>  
<div class="container">  
<div class="content">  
<div style="position: relative; top: 410px; left: 500px; width: 300px; height: 200px;">  
<table width="300" align="center" border="1px">  
<tr>  
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="#" OnClick="window.open('http://www.google.fr');" OnMouseOver="document.getElementById('TestIframe').src='http://www.google.fr';" ><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>  
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="#" OnClick="window.open('http://lartsencadre.fr/index.html');" OnMouseOver="document.getElementById('TestIframe').src='http://lartsencadre.fr/index.html';" ><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>  
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="#" OnClick="window.open('http://lartsencadre.fr/index.html');" OnMouseOver="document.getElementById('TestIframe').src='http://lartsencadre.fr/index.html';" ><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>  
<td width="62" height="75" align="center" valign="middle" scope="col"><a href="#" OnClick="window.open('http://lartsencadre.fr/index.html');" OnMouseOver="document.getElementById('TestIframe').src='http://lartsencadre.fr/index.html';" ><img src="img/cadr1.png" alt="" width="62" height="75"></a></td>  
</tr>  
<tr>  
<td  height="210" colspan="4" align="left" valign="top"><iframe id="TestIframe" src="" align="top" height="210" width="300" frameborder="0" name="txt" scrolling="no" ></iframe></td>  
</tr>  
</table>  
</div>  
</div>  
</div>  
</body>  
</html>

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

Posez votre question

Réponse 5 / 5

lemask Messages postés 4 Date d'inscription jeudi 8 janvier 2009 Statut Membre Dernière intervention 15 novembre 2012
15 nov. 2012 à 18:30

Bonjour,
Merci pour cette mise à jour.
C'est comme je le souhaitais.
Cordialement

Discussions similaires

Je veux retrouver mon ancienne page d'accueil

restaurer la page google comme page d'accueil

Live tiktok