Se connecter / S'enregistrer
Votre question

Lien dans liste déroulante

Tags :
  • CSS
  • Programmation
Dernière réponse : dans Programmation
22 Mars 2010 21:31:10

Bonsoir à tous,

Je viens de me mettre au language XHTML/CSS il y 15 jours.

Je suis assez content de moi car j'ai réussit à créer une page d'acceuil avec des menus et des liens qui amènent sur une deuxième page.

Mais depuis le début j'avais une idée en tête. Comme je suis passionné d'astronautique et plus particuliérement de la navette spatiale j'ai commencé à faire une page d'acceuil avec une liste déroulante qui devra comporter toutes les missions de la navette. de STS 1 à STS 130.

Bon pour la liste déroulante ca va j'ai pu la positionner, j'ai créer une page CSS pour plus tard le design.

mon problème est le suivant, je suis incapable de trouver la manière d'associer un lien vers une page supplémentaire à chaque fois qu'une mission est choisie dans la liste déroulante.

Je crois que m'a question a ét souvant posée, je l'ai constater mais je n'y vois pas claire et je vois que l'expression Javascript revient souvent. Est-ce que je dois écrire quelque chose dans un autre language que XHTML/CSS pour faire ce que je désire.

merci pour vos réponse, je vous envoie la page XHTML de ce qui doit être la page d'acceuil.

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  3. <head>
  4. <title>Mission STS</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <link rel="stylesheet" media="screen" type="text/css" title="STSDESIGN" href="STSDESIGN.css" />
  7.  
  8. </head>
  9.  
  10. <body>
  11. <!--Bloc de remplissage en bas-->
  12. <div id="blocbasmenusts">
  13. <h3></h3>
  14. </div>
  15.  
  16. <div id="menuderoulant">
  17. <form method="post" action="traitement.php">
  18. <p>
  19. <label for="pays">MISSION</label><br />
  20. <select name="pays" id="pays">
  21. <option value="STS-1">STS-1</option>
  22. <option value="STS-2">STS-2</option>
  23. <option value="STS-3">STS-3</option>
  24. <option value="STS-4">STS-4</option>
  25. <option value="STS-5">STS-5</option>
  26. <option value="STS-6">STS-6</option>
  27. <option value="STS-7">STS-7</option>
  28. <option value="STS-8">STS-8</option>
  29. <option value="STS-9">STS-9</option>
  30.  
  31.  
  32.  
  33. </select>
  34. <p>
  35. <input type="submit" /> <input type="reset" />
  36. </p>
  37. </p>
  38. </form>
  39. </div>
  40.  
  41. </body>


Autres pages sur : lien liste deroulante

a c 232 L Programmation
25 Mars 2010 19:35:09

Salut,

En effet, HTML et CSS ne te suffiront pas, il te faudra utiliser du JavaScript côté client ou du PHP (ou autres) côté serveur pour faire ce que tu veux.
Je vois que tu as un fichier traitement.php sur lequel pointe ton formulaire. Est-ce que tu fais un peu de PHP ou est-ce que c'est un bout de code que tu as copié sans vraiment savoir ce que ça faisait ?
m
0
l
25 Mars 2010 21:07:18

Dans ta page traitement.php, écris qlq chose comme ça:
<meta http-equiv="refresh" content="0; url=<?php echo $_POST['pays']; ?>" />

Ce code effectuera une redirection vers la valeur "pays".

A+
m
0
l
Contenus similaires
26 Mars 2010 21:31:04

OmaR a dit :
Salut,

En effet, HTML et CSS ne te suffiront pas, il te faudra utiliser du JavaScript côté client ou du PHP (ou autres) côté serveur pour faire ce que tu veux.
Je vois que tu as un fichier traitement.php sur lequel pointe ton formulaire. Est-ce que tu fais un peu de PHP ou est-ce que c'est un bout de code que tu as copié sans vraiment savoir ce que ça faisait ?



Ca y est j'ai inclus une page PHP, et mes liens fonctionnent:

Pour info ma page HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mon super site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="ESSAISLIEN" href="ESSAISLIEN.css" />
</head>

<body>


<div id="listederoulante">
<form method="post" action="http://www.monsite.net/redirection_navigation.php">
<p>
<!-- une balise select ou input ne peut pas être imbriquée directement dans form -->
<select name="menu_destination" onchange="document.location = this.options[this.selectedIndex].value;">

<option value="http://www.monsite.net/accueil.html">MISSIONS</option>
<option value="C:/users/entree/desktop/STS/ESSAISLIEN.html">Acceuil</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-1</option>
<option value="C:/users/entree/documents/essai.html">STS-2</option>
<option value="http://www.nasa.gov/">STS-3</option>
<option value="http://www.monsite.net/accueil.html">STS-4</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-5</option>
<option value="C:/users/entree/documents/essai.html">STS-6</option>
<option value="http://www.nasa.gov/">STS-7</option>
<option value="http://www.monsite.net/accueil.html">STS-8</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-9</option>
<option value="C:/users/entree/documents/essai.html">STS-41-B</option>
<option value="http://www.nasa.gov/">STS-41-C</option>
<option value="http://www.monsite.net/accueil.html">STS-41-D</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-41-G</option>
<option value="C:/users/entree/documents/essai.html">STS-51-A</option>
<option value="http://www.nasa.gov/">STS-51-C</option>
<option value="http://www.monsite.net/accueil.html">STS-51-D</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-51-B</option>
<option value="C:/users/entree/documents/essai.html">STS-51-G</option>
<option value="http://www.nasa.gov/">STs-51-F</option>
<option value="http://www.monsite.net/accueil.html">STS-51-I</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-51-J</option>
<option value="C:/users/entree/documents/essai.html">STS-61-A</option>
<option value="http://www.nasa.gov/">STS-61-B</option>
<option value="http://www.monsite.net/accueil.html">STS-61-C</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-51-L</option>
<option value="C:/users/entree/documents/essai.html">STS-26</option>
<option value="http://www.nasa.gov/">STS-27</option>
<option value="http://www.monsite.net/accueil.html">STS-29</option>
<option value="C:/users/entree/documents/essaisdeux.html">STS-30</option>
<option value="C:/users/entree/documents/essai.html">STS-28</option>
<option value="http://www.nasa.gov/">STS-34</option>







</select>

<input type="submit" value="Go" title="valider pour aller à la page sélectionnée" />

</p>
</form>
</div>


<div id="corpssts2">
<h3>MISSION STS-1</h3>


<p>Navette:</p>
<p>Date de lancement:</p>
<p>Heure:</p>
<p>Site:</p>
<p>Date d'atterrissage:</p>
<p>Heure:</p>
<p>Site:</p>
<p>Durée de la mission:</p>
<p>Orbite:</p>
<p>Altitude orbitale:</p>
<p>Inclinaison:</p>
<p>Distance parcourue:</p>
<p>Charge utile:</p>
<p>Poid:</p>

</p>




<div id="corpssts3">
<h3>MISSION STS-1</h3>


<p>Navette:</p>
<p>Date de lancement:</p>
<p>Heure:</p>
<p>Site:</p>
<p>Date d'atterrissage:</p>
<p>Heure:</p>
<p>Site:</p>
<p>Durée de la mission:</p>
<p>Orbite:</p>
<p>Altitude orbitale:</p>
<p>Inclinaison:</p>
<p>Distance parcourue:</p>
<p>Charge utile:</p>
<p>Poid:</p>

</p>


</div>

Pour info la page CSS

#listederoulante

{
position: absolute;
left: 40px;
top: 150px
}




h1
{
text-align: justify;
}






#corpssts2
{
position: absolute;
left: 40px;
top: 200px;
width: 140px;
height: 800px;
background-color: #e5e5e5;
text-align: justify;
font-weight: bold;
padding: 5px;
border-top: 2px solid black;
border-left: 2px solid black;
border-bottom: 2px solid black;

}

#corpssts3
{
position: absolute;
left: 120px;
top: 0px;
width: 140px;
height: 800px;
background-color: #e5e5e5;
text-align: justify;
font-weight: bold;
padding: 5px;
border-top: 2px solid black;
border-left: 2px solid black;
border-bottom: 2px solid black;

}

et la page PHP

<?php
/* on vérifie que l'information "menu_destination" existe ET qu'elle n'est pas vide : */
if ( isset($_POST['menu_destination']) && !empty($_POST['menu_destination']) )

/* si c'est bien le cas (existe ET non-vide à la fois), on redirige le visiteur vers sa valeur choisie de l'information "menu_direction" : */
{header("Location: ".$_POST['menu_destination']."");}

/* sinon, on le redirige vers une autre page utile : */
else
{header("Location: http://www.monsite.net/plan.html");}
?>

... mais j'en bave trop pour la moindre chose.

Comme mon projet concerne 131 vols avec des liens dans tous les sens et des mises en pages que je ne maîtrise pas encore, je sais pas si je vais allez jusqu'au bout

Merci pour votre réponse


m
0
l
a c 232 L Programmation
26 Mars 2010 22:00:39

Salut,

Tes liens avec C:\ ne fonctionneront pas une fois que tu l'auras mis sur internet.
Il faut mettre des liens relatifs et pas absolus.
m
0
l
26 Mars 2010 22:09:39

Je vais modifier tout cela !

Je vous tiens au courant
m
0
l
27 Mars 2010 11:17:39

Voilà, les liens dans la liste ont été modifiés d'absolus" à "relatifs"




  1. <div id="listederoulante">
  2. <form method="post" action="http://www.monsite.net/redirection_navigation.php">
  3. <p>
  4. <!-- une balise select ou input ne peut pas être imbriquée directement dans form -->
  5. <select name="menu_destination" onchange="document.location = this.options[this.selectedIndex].value;">
  6. <option value="inactif">MISSIONS</option>
  7. <option value="essaislien.html">Acceuil</option>
  8. <option value="essaissts1.html">STS-1</option>
  9. <option value="essaissts2.html">STS-2</option>
  10. <option value="essaissts3.html">STS-3</option>
  11. <option value="essaissts4.html">STS-4</option>
  12. <option value="essaissts5.html">STS-5</option>
  13. <option value="essaissts6.html">STS-6</option>
  14. <option value="essaissts7.html">STS-7</option>
  15. <option value="essaissts8.html">STS-8</option>
  16. <option value="essaissts9.html">STS-9</option>
  17. <option value="essaissts41b.html">STS-41-B</option>
  18. <option value="essaissts41c.html">STS-41-C</option>
  19. <option value="essaissts41d.html">STS-41-D</option>
  20. <option value="essaissts41g.html">STS-41-G</option>
  21. <option value="essaissts51a.html">STS-51-A</option>
  22. <option value="essaissts51c.html">STS-51-C</option>
  23. <option value="essaissts51d.html">STS-51-D</option>
  24. <option value="essaissts51b.html">STS-51-B</option>
  25. <option value="essaissts51g.html">STS-51-G</option>
  26. <option value="essaissts51f.html">STs-51-F</option>
  27. <option value="essaissts51i.html">STS-51-I</option>
  28. <option value="essaissts51j.html">STS-51-J</option>
  29. <option value="essaissts61a.html">STS-61-A</option>
  30. <option value="essaissts61b.html">STS-61-B</option>
  31. <option value="essaissts61c.html">STS-61-C</option>
  32. <option value="essaissts51l.html">STS-51-L</option>
  33. <option value="essaissts26.html">STS-26</option>
  34. <option value="essaissts27.html">STS-27</option>
  35. <option value="essaissts29.html">STS-29</option>
  36. <option value="essaissts30.html">STS-30</option>
  37. <option value="essaissts28.html">STS-28</option>
  38. <option value="essaissts34.html">STS-34</option>
  39.  
  40. </select>
  41.  
  42. <input type="submit" value="Go" title="valider pour aller à la page sélectionnée" />
  43.  
  44. </p>
  45. </form>
  46. </div>


Tous ces liens doivent renvoyer à une page de présentation sommaire comportant une fiche de présentation technique de la mission sur un bloc gauche (la liste déroulante se situant au dessus de celui-ci).
Un bloc central doit comporter une description de la mission et un bloc droit renseignera sur l'équipage.
Chaque page STS renverra également sur un portfolio photo en miniature de la mission en question.
Chaque miniature renverra à la photo HD si possible, par l'intermédiaire d'un hébergeur d'image.

Au jour d'aujourd'hui, j'en suis au dimensionnement et positionnement des blocs de la page STS de référence.
m
0
l
a c 232 L Programmation
27 Mars 2010 12:46:54

Salut,

Je vois que ça avance bien :) 

Est-ce que tu as une question spécifique ou est-ce que tu nous tenais juste au courant de ton avancement ?
m
0
l
27 Mars 2010 14:19:29

Bonjour,

Et bien pour tout dire, en m'inscrivant sur ce forum mon interrogation était de savoir comment faire pour que ma liste déroulante renvoie correctement vers mes pages.
Le problème, après nombres de recherches semble être résolu.
Vos interventions m'ont permis de prendre garde au bon choix des liens "absolu, relatif"
Bonnant malant, le fait que plusieurs personnes aient répondu à mon premier message, semble m'encourager à persévérer dans mon projet.

Je viens de terminer en grande partie la disposition de la page type, qui se répètera 134 fois (nombre des missions navette).



L'idée de ce site m'est venue de travaux que j'effectuais sur les missions STS.
Parmi la multitude de sites traitant de la navette spatiale, aucun ne rassemble des informations complètes et un échantillon photographique conséquent de l'intégralité des missions.

J'aurais sûrement durant l'élaboration de "cette bêtise" des questions à vous poser.

Maintenant je ne connais pas trop le fonctionnement de votre forum.

Peut-être que l'élaboration de ce projet est d'ordre privé et que je dois m'en tenir à des interventions purement techniques.

N'hésitez pas à me le faire savoir.
m
0
l
3 Avril 2010 21:21:10

Bonjour à tous,

La page type mission est finalisée.
Elle se compose d'un bandeau, deux boutons de navigation page précédente et page suivante, le liste déroulante, un bloc gauche, centrale et droit, une série de miniatures qui renvoient à une page avec la photo choisie (entre 500 et 1000px de large).

Je me permet de vous soumettre mon travail, si vous y remarquez quelque chose qui pourrait clocher, n'hésiter pas.

A la fin du message j'ai quelques questions.



HTML

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  3. <head>
  4. <title>MISSIONS STS</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <link rel="stylesheet" media="screen" type="text/css" title="sts" href="sts.css" />
  7. </head>
  8.  
  9. <body>
  10.  
  11. <div id="en_tete">
  12. </div>
  13. <div id="listederoulante">
  14. <form method="post" action="http://www.monsite.net/redirection_navigation.php">
  15. <p>
  16. <!-- une balise select ou input ne peut pas être imbriquée directement dans form -->
  17. <select name="menu_destination" onchange="document.location = this.options[this.selectedIndex].value;">
  18. <option value="inactif">CHERCHER UNE MISSION</option>
  19. <option value="acceuilsts.html">Acceuil</option>
  20. <option value="sts1.html">STS-1 (04/1981)</option>
  21. <option value="sts2.html">STS-2 (11/1981)</option>
  22. <option value="sts3.html">STS-3 (03/1982)</option>
  23. <option value="sts4.html">STS-4 (06/1982)</option>
  24. <option value="sts5.html">STS-5 (11/1982)</option>
  25. <option value="sts6.html">STS-6 (04/1983)</option>
  26. <option value="sts7.html">STS-7 (06/1983)</option>
  27. <option value="sts8.html">STS-8 (08/1983)</option>
  28. <option value="sts9.html">STS-9 (11/1983)</option>
  29. <option value="sts41b.html">STS-41-B (02/1984)</option>
  30. <option value="ssts41c.html">STS-41-C (04/1984)</option>
  31. <option value="sts41d.html">STS-41-D (08/1984)</option>
  32. <option value="sts41g.html">STS-41-G (10/1984)</option>
  33. <option value="sts51a.html">STS-51-A (11/1984)</option>
  34. <option value="sts51c.html">STS-51-C (01/1985)</option>
  35. <option value="sts51d.html">STS-51-D (04/1985)</option>
  36. <option value="sts51b.html">STS-51-B (04/1985)</option>
  37. <option value="sts51g.html">STS-51-G (06/1985)</option>
  38. <option value="sts51f.html">STs-51-F (07/1985)</option>
  39. <option value="sts51i.html">STS-51-I (08/1985)</option>
  40. <option value="sts51j.html">STS-51-J (10/1985)</option>
  41. <option value="sts61a.html">STS-61-A (10/1985)</option>
  42. <option value="sts61b.html">STS-61-B (11/1985)</option>
  43. <option value="sts61c.html">STS-61-C (01/1986)</option>
  44. <option value="sts51l.html">STS-51-L (01/1986)</option>
  45. <option value="sts26.html">STS-26 (09/1988)</option>
  46. <option value="sts27.html">STS-27 (12/1988)</option>
  47. <option value="sts29.html">STS-29 (03/1989)</option>
  48. <option value="sts30.html">STS-30 (05/1989)</option>
  49. <option value="sts28.html">STS-28 (08/1989)</option>
  50. <option value="sts34.html">STS-34 (10/1989)</option>
  51. <option value="sts1.html">STS-33 (11/1989)</option>
  52. <option value="sts2.html">STS-32 (01/1990)</option>
  53. <option value="sts3.html">STS-36 (02/1990)</option>
  54. <option value="sts4.html">STS-31 (04/1990)</option>
  55. <option value="sts5.html">STS-41 (10/1990)</option>
  56. <option value="sts6.html">STS-38 (11/1990)</option>
  57. <option value="sts7.html">STS-35 (12/1990)</option>
  58. <option value="sts8.html">STS-37 (04/1991)</option>
  59. <option value="sts9.html">STS-39 (04/1991)</option>
  60. <option value="sts41b.html">STS-40 (06/1991)</option>
  61. <option value="ssts41c.html">STS-43 (08/1991)</option>
  62. <option value="sts41d.html">STS-48 (09/1991)</option>
  63. <option value="sts41g.html">STS-44 (11/1991)</option>
  64. <option value="sts51a.html">STS-42 (01/1992)</option>
  65. <option value="sts51c.html">STS-45 (03/1992)</option>
  66. <option value="sts51d.html">STS-49 (05/1992)</option>
  67. <option value="sts51b.html">STS-50 (06/1992)</option>
  68. <option value="sts51g.html">STS-46 (07/1992)</option>
  69. <option value="sts51f.html">STs-47 (09/1992)</option>
  70. <option value="sts51i.html">STS-52 (10/1992)</option>
  71. <option value="sts51j.html">STS-53 (12/1992)</option>
  72. <option value="sts61a.html">STS-54 (01/1993)</option>
  73. <option value="sts61b.html">STS-56 (04/1993)</option>
  74. <option value="sts61c.html">STS-55 (04/1993)</option>
  75. <option value="sts51l.html">STS-57 (06/1993)</option>
  76. <option value="sts26.html">STS-51 (09/1993)</option>
  77. <option value="sts27.html">STS-58 (10/1993)</option>
  78. <option value="sts29.html">STS-61 (12/1993)</option>
  79. <option value="sts30.html">STS-60 (02/1994)</option>
  80. <option value="sts28.html">STS-62 (03/1994)</option>
  81. <option value="sts34.html">STS-59 (04/1994)</option>
  82. <option value="sts1.html">STS-65 (07/1994)</option>
  83. <option value="sts2.html">STS-64 (09/1994)</option>
  84. <option value="sts3.html">STS-68 (09/1994)</option>
  85. <option value="sts4.html">STS-66 (11/1994)</option>
  86. <option value="sts5.html">STS-63 (02/1995)</option>
  87. <option value="sts6.html">STS-67 (03/1995)</option>
  88. <option value="sts7.html">STS-71 (06/1995)</option>
  89. <option value="sts8.html">STS-70 (07/1995)</option>
  90. <option value="sts9.html">STS-69 (09/1995)</option>
  91. <option value="sts41b.html">STS-73 (10/1995)</option>
  92. <option value="ssts41c.html">STS-74 (11/1995)</option>
  93. <option value="sts41d.html">STS-72 (01/1996)</option>
  94. <option value="sts41g.html">STS-75 (02/1996)</option>
  95. <option value="sts51a.html">STS-76 (03/1996)</option>
  96. <option value="sts51c.html">STS-77 (05/1996)</option>
  97. <option value="sts51d.html">STS-78 (06/1996)</option>
  98. <option value="sts51b.html">STS-79 (09/1996)</option>
  99. <option value="sts51g.html">STS-80 (11/1996)</option>
  100. <option value="sts51f.html">STs-81 (01/1997)</option>
  101. <option value="sts51i.html">STS-82 (02/1997)</option>
  102. <option value="sts51j.html">STS-83 (04/1997)</option>
  103. <option value="sts61a.html">STS-84 (05/1997)</option>
  104. <option value="sts61b.html">STS-94 (07/1997)</option>
  105. <option value="sts61c.html">STS-85 (08/1997)</option>
  106. <option value="sts51l.html">STS-86 (09/1997)</option>
  107. <option value="sts26.html">STS-87 (11/1997)</option>
  108. <option value="sts27.html">STS-89 (01/1998)</option>
  109. <option value="sts29.html">STS-90 (04/1998)</option>
  110. <option value="sts30.html">STS-91 (06/1998)</option>
  111. <option value="sts28.html">STS-95 (10/1998)</option>
  112. <option value="sts34.html">STS-88 (12/1998)</option>
  113. <option value="sts1.html">STS-96 (05/1999)</option>
  114. <option value="sts2.html">STS-93 (07/1999)</option>
  115. <option value="sts3.html">STS-103 (12/1999)</option>
  116. <option value="sts4.html">STS-99 (02/2000)</option>
  117. <option value="sts5.html">STS-101 (05/2000)</option>
  118. <option value="sts6.html">STS-106 (09/2000)</option>
  119. <option value="sts7.html">STS-92 (10/2000)</option>
  120. <option value="sts8.html">STS-97 (12/2000)</option>
  121. <option value="sts9.html">STS-98 (02/2001)</option>
  122. <option value="sts41b.html">STS-102 (03/2001)</option>
  123. <option value="ssts41c.html">STS-100 (04/2001)</option>
  124. <option value="sts41d.html">STS-104 (07/2001)</option>
  125. <option value="sts41g.html">STS-105 (08/2001)</option>
  126. <option value="sts51a.html">STS-108 (12/2001)</option>
  127. <option value="sts51c.html">STS-110 (04/2002)</option>
  128. <option value="sts51d.html">STS-111 (06/2002)</option>
  129. <option value="sts51b.html">STS-112 (10/2002)</option>
  130. <option value="sts51g.html">STS-113 (11/2002)</option>
  131. <option value="sts51f.html">STs-107 (01/2003)</option>
  132. <option value="sts51i.html">STS-114 (07/2005)</option>
  133. <option value="sts51j.html">STS-121 (07/2006)</option>
  134. <option value="sts61a.html">STS-115 (11/2006)</option>
  135. <option value="sts61b.html">STS-116 (12/2006)</option>
  136. <option value="sts61c.html">STS-117 (06/2007)</option>
  137. <option value="sts51l.html">STS-118 (08/2007)</option>
  138. <option value="sts26.html">STS-120 (10/2007)</option>
  139. <option value="sts27.html">STS-122 (02/2008)</option>
  140. <option value="sts29.html">STS-123 (03/2008)</option>
  141. <option value="sts30.html">STS-124 (05/2008)</option>
  142. <option value="sts28.html">STS-126 (11/2008)</option>
  143. <option value="sts34.html">STS-119 (03/2009)</option>
  144. <option value="sts51l.html">STS-125 (05/2009)</option>
  145. <option value="sts26.html">STS-127 (07/2009)</option>
  146. <option value="sts27.html">STS-128 (08/2009)</option>
  147. <option value="sts29.html">STS-129 (11/2009)</option>
  148. <option value="sts30.html">STS-130 (02/2010)</option>
  149. <option value="sts28.html">STS-131 (?)</option>
  150. <option value="sts34.html">STS-132 (?)</option>
  151. <option value="sts28.html">STS-134 (?)</option>
  152. <option value="sts34.html">STS-133 (?)</option>
  153.  
  154.  
  155.  
  156. </select>
  157.  
  158. <input type="submit" value="Go" title="valider pour aller à la page sélectionnée" />
  159.  
  160. </p>
  161. </form>
  162. </div>
  163. </p>
  164.  
  165.  
  166. <p class="boutonnavigationdroit">
  167. <a href="sts2.html"><img src="dossierphotoSTS1/boutonnavigation4.jpg" alt="boutonnavigation " title="Cliquez pour la page suivante" border="0"/></a>
  168. </p>
  169.  
  170. <p class="boutonnavigationgauche">
  171. <a href="acceuilsts.html"><img src="dossierphotoSTS1/boutonnavigationgauche.jpg" alt="boutonnavigationgauche " title="Cliquez pour la page précédente" border="0" /></a>
  172. </p>
  173.  
  174. <div id="bandeaunumerosts">
  175. <h1>STS-1</h1>
  176. </div>
  177.  
  178.  
  179.  
  180. <div id="corpssts1gauche">
  181.  
  182. <h3>DONNEES</h3>
  183.  
  184. <p><strong>Navette:</strong><br/>
  185. Columbia</p>
  186. <p><strong>Date de lancement:</strong><br/>
  187. 12 Avril 1981</p>
  188. <p><strong>Heure:</strong><br/>
  189. 12:00:03 GMT</p>
  190. <p><strong>Site:</strong><br/>
  191. Pas de tir 39A<br/>
  192. Kennedy Space Center<br/>
  193. FLORIDE</p>
  194. <p><strong>Date d'atterrissage:</strong><br/>
  195. 14 Avril 1981 </p>
  196. <p><strong>Heure:</strong><br/>
  197. 18:20:57 GMT</p>
  198. <p><strong>Site:</strong><br/>
  199. Piste 23<br/>
  200. Base d'Edwards<br/>
  201. CALIFORNIE</p>
  202. <p><strong>Durée de la mission:</strong><br/>
  203. 2 jours,<br/>
  204. 6 heures<br/>
  205. 20 minutes,<br/>
  206. 53 secondes</p>
  207. <p><strong>Orbites:</strong><br/>
  208. 36</p>
  209. <p><strong>Altitude orbitale:</strong><br/>
  210. 307 kilomètres</p>
  211. <p><strong>Inclinaison orbitale:</strong><br/>
  212. 40.3 degrés</p>
  213. <p><strong>Distance parcourue:</strong><br/>
  214. 1,728 millions de kilomètres</p>
  215. <p><strong>Charge utile:</strong><br/>
  216. Palettes ACIP/DFI</p>
  217. <p><strong>Masse:</strong><br/>
  218. 4909 kg</p>
  219.  
  220.  
  221.  
  222.  
  223.  
  224.  
  225.  
  226. <div id="corpssts1centre">
  227.  
  228. <h3>INFORMATIONS</h3>
  229.  
  230. <p>La navette Columbia décolle du pas de tir 39A du Kennedy Space Center le 12 avril 1981 à 12h00 GMT.
  231. Un report de deux jours a été nécessaire avant le décollage, pour cause de détections d'anomalies sur les ordinateurs de bord de la navette.
  232. A son bord se trouvent deux des meilleurs astronautes de la Nasa : John Young et Robert Crippen.<br/><br/>
  233. La charge utile se compose de la palette DFI (Developmental Flight Instrumentation) et de la palette ACIP (Aerodynamic Coefficient Identifications package). Il s'agit essentiellement de capteurs et d'appareils de mesure permettant d'enregistrer des données telles que les contraintes de la navette lors du décollage, de la mission et de l'atterrissage.
  234. D'autres données comme l'aérodynamisme ou la dynamique aérothermique et structurelle fûrent receuillies.<br/><br/>
  235. La mise en orbite se déroule sans problème, de même que tous les tests des systèmes de la navette.
  236. Puis, après deux jours dans l'espace, les moteurs de Columbia sont allumés pendant environ 2 minutes et 40 secondes afin de quitter l'orbite.
  237. La rentrée dans l'atmosphère est réussie et la navette se pose sur la base de l'Air Force à Edwards (Californie), avec seulement quelques secondes de retard sur le plan de vol.
  238. Tous les objectifs de la mission ont donc été remplis. Cependant, les analyses et les inspections réalisées après le vol ont mis en évidence plusieurs problèmes importants.<br/><br/>
  239. Premièrement, le pas de tir du Kennedy Space Center a subi des contraintes importantes au moment du décollage, à cause du bruit et des vibrations engendrés par la navette.
  240. Dès le vol suivant, le système d'inondation du pas de tir sera donc perfectionné. <br/><br/>
  241. Deuxièmement, l'observation par des caméras sur les bras articulés télécommandées par Houston ont détecté que des tuiles s'étaient détachées de la queue de la navette.
  242. En revanche, les tuiles des protections thermiques au-dessous de la navette sont restées intactes. Les spécialistes au sol n'ont pas jugé nécessaire d'organiser une sortie des astronautes pour réparer les anomalies détectées.<br/><br/>
  243. Troisièmement, les ingénieurs de la Nasa se sont rendu compte que Columbia avait subi des contraintes plus fortes que prévues au cours de la phase de retour sur Terre.<br/><br/>
  244.  
  245.  
  246. <h3 id="ancrephotosts1">PHOTOGRAPHIES</h3>
  247.  
  248. <a href="STS1equipage.html"><img src="dossierphotoSTS1/miniatureequipageSTS1.gif" alt="Equipage STS1" border="1" /></a>
  249. <a href="STS1equipageinterieur.html"><img src="dossierphotoSTS1/equipageinterieurSTS1.gif" alt="Equipage cabine STS1" border="1" /></a>
  250. <a href="sts1columbiapad39a.html"><img src="dossierphotoSTS1/miniaturecolumbiapad39a.gif" alt="Navette Columbia STS1" border="1" /></a>
  251. <a href="sts1decollage.html"><img src="dossierphotoSTS1/miniaturelaunchSTS1.gif" alt="Lancement STS1 "border="1" /></a>
  252. <a href="YoungSTS1.html"><img src="dossierphotoSTS1/JohnYoungSTS1120x.gif" alt="John W.Young STS1" border="1" /></a>
  253. <a href="CrippenSTS1.html"><img src="dossierphotoSTS1/sts1crippenminiature120x.gif" alt="Robert.L.Crippen.STS1" border="1" /></a>
  254. <a href="sts1aterrissage.html"><img src="dossierphotoSTS1/miniatureSTS1atterrissage.gif" alt="Atterrissage STS1"border="1" /></a>
  255. <a href="sts1atterrissageequipage.html"><img src="dossierphotoSTS1/miniatureequipagests1atterrissage.gif" alt="Equipage STS1 atterrissage" border="1" /></a>
  256. <a href="sts1patch.html"><img src="dossierphotoSTS1/miniaturepatchsts1.gif" alt="Patch STS1" border="1" /></a><br/><br/>
  257.  
  258. </p>
  259. </div>
  260.  
  261.  
  262. <div id="corpssts1droit">
  263.  
  264. <p>
  265. <h3>EQUIPAGE</h3>
  266. </p>
  267.  
  268. <p class="photoequipage">
  269. <img src="dossierphotoSTS1/equipageSTS1.jpg" alt="equipage STS1" />
  270. </p>
  271.  
  272. <p><strong>Composante:</strong><br/>
  273. 2 hommes<br/><br/>
  274. <strong>Commandant:</strong><br/>
  275. John W. Young - NASA - Etats Unis<br/>
  276. <strong>Pilote:</strong><br/>
  277. Robert L. Crippen - NASA - Etats Unis<br/><br/>
  278. <strong>Equipage de réseve:</strong><br/>
  279. Commandant :<br/>
  280. Joseph H. Engle - NASA -Etats Unis<br/>
  281. Pilote :<br/>
  282. Richard H. Truly - NASA - Etats Unis</p>
  283. </p>
  284.  
  285.  
  286.  
  287.  
  288. </div>
  289. </body>




CSS

  1. body
  2. {
  3. background-color: white;
  4. }
  5.  
  6.  
  7. #en_tete
  8. {
  9. width: 1050px;
  10. height: 120px;
  11. background-image: url("dossierphotosts1/banniere15.jpg");
  12. background-repeat: no-repeat;
  13. margin-bottom: 10px;
  14. position: absolute;
  15. left: 40px;
  16. top: 20px
  17. }
  18.  
  19.  
  20.  
  21.  
  22. #listederoulante
  23.  
  24. {
  25. position: absolute;
  26. left: 545px;
  27. top: 185px
  28.  
  29. }
  30.  
  31. #bandeaunumerosts
  32. {
  33.  
  34. position: absolute;
  35. left:282px;
  36. top: 169px;
  37. background-color: #ffff99;
  38. padding-left: 20px;
  39. padding-right: 20px;
  40. border: 2px solid black;
  41. }
  42.  
  43. .boutonnavigationdroit
  44. {position: absolute;
  45. left: 960px;
  46. top: 145px;
  47.  
  48. }
  49.  
  50. .boutonnavigationgauche
  51. {position: absolute;
  52. left: 40px;
  53. top: 145px;
  54.  
  55. }
  56.  
  57. .boutonnavigationgauchepagephoto
  58. {position: absolute;
  59. left: 10px;
  60. top: 10px;
  61. }
  62.  
  63. .photodepages
  64. {position: absolute;
  65. left: 100px;
  66. top: 30px;
  67. }
  68. .legende
  69. {position: absolute;
  70. left: 100px;
  71. top: 10px;
  72. }
  73.  
  74. h1
  75. {
  76. text-align: justify;
  77. }
  78.  
  79.  
  80. .photoequipage
  81. { width: 250px;
  82. height: 195px;
  83.  
  84. border: 2px solid black;
  85. }
  86.  
  87.  
  88.  
  89.  
  90.  
  91.  
  92.  
  93.  
  94. #corpssts1gauche
  95. {
  96.  
  97. position: absolute;
  98. left: 40px;
  99. top: 249px;
  100. width: 200px;
  101. background-color: #242424;
  102. text-align: justify;
  103. color: white;
  104. font-family: inherit;
  105. padding: 5px;
  106. border: 2px solid black;
  107.  
  108. }
  109.  
  110.  
  111. #corpssts1centre
  112. {
  113.  
  114. position: absolute;
  115. left: 240px;
  116. top: 0px;
  117. width: 500px;
  118. background-color: #e4e4e4;
  119. color: black;
  120. font-family: inherit;
  121. padding: 5px;
  122. border: 2px solid black;
  123. }
  124.  
  125.  
  126. #corpssts1droit
  127. {
  128. position: absolute;
  129. left: 780px;
  130. top: 0px;
  131. width: 254px;
  132. background-color: #003466;
  133. text-align: justify;
  134. color: white;
  135. font-family: inherit;
  136. padding: 5px;
  137. border: 2px solid black;
  138. }




Exemple page HTML "photo"

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  3. <head>
  4. <title>MISSIONS STS</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <link rel="stylesheet" media="screen" type="text/css" title="sts" href="sts.css" />
  7. </head>
  8.  
  9. <body>
  10. <p class="boutonnavigationgauchepagephoto">
  11. <a href="sts1.html#ancrephotosts1"><img src="dossierphotoSTS1/boutonnavigationgauche.jpg" alt="boutonnavigationgauche " title="Cliquez pour la page précédente" border="0" /></a>
  12. </p>
  13. <p class="photodepages">
  14. <img src="dossierphotoSTS1/equipagests11200x.gif" alt="equipage STS1" /><br/><br/>
  15.  
  16.  
  17. </p>
  18. <p class="legende">
  19. L'équipage de STS-1, le Cdt John Young et le pilote Robert Crippen.
  20. </p>
  21.  
  22. </body>



Voilà.
j'ai une chose qui me gêne, quand j'ouvre dans Google chrome j'ai cela





et quand j'ouvre dan IE j'ai cela



on observe dans IE un décalage au niveau de l'étiquette jaune STS1 et le bloc centrale.

je n'arrive pas à m'expliquer la cause.

merci de m'avoir lu et pour vos réponses

a bientôt
m
0
l
a c 232 L Programmation
3 Avril 2010 23:58:57

Salut,

Chaque navigateur utilise sa propre façon de gérer le HTML et le CSS, un même code donne toujours des choses différentes sur les différents navigateurs.
Chacun définit ses propres tailles, ses propres marges, padding, etc...

Une méthode pour partir sur quelque chose d'équivalent pour tous, est de prendre un "reset CSS". Un très simple et qui apporte déjà beaucoup est de mettre:
  1. * {
  2. margin: 0;
  3. padding: 0;
  4. }

Après, il y en a des plus évolués qui redéfinissent énormément de choses, mais ça suffit pour la plupart des cas.

Ca devrait normalement améliorer l'affichage sur les différents navigateurs, par contre, ça peut te casser un peu l'affichage actuel vu que tu n'avais pas forcément prévu ces nouvelles marges.

Mais une fois que tu auras ajouté ça, que tu auras corrigé pour avoir un aperçu qui te va sous Chrome ou IE, on pourra t'aider à améliorer ça.
m
0
l
4 Avril 2010 10:02:26

Merci bien, OmaR

A bientôt
m
0
l
4 Avril 2010 10:18:55

Ok, j'ai intégrer l'écriture "reset CSS"

Concrètement effectivement cela unifie la présentation, que cela soit sur Chrome ou IE.

Le panneau jaune "STS" des missions ce trouve décollé du bloc centrale.
Cela n'est pas gênant, au contraire tout compte fait c'est plus lisible.

Certaines données se sont collées, il me reste simplement à introduire des <br/>

merci pour l'info
m
0
l
a c 232 L Programmation
4 Avril 2010 11:22:06

Salut,

Sinon, plutôt que d'intégrer des <br />, tu peux mettre des marges à tes éléments.
Typiquement, un margin:1em; va être l'équivalent d'un <br />, tu peux comme ça l'appliquer facilement à tous tes paragraphes, ou autres...
m
0
l
10 Avril 2010 17:54:25

Bonjour à tous,

Le projet avance, je termine la neuvième missions.

A ce stade je me pose une question en ce qui concerne le poids des photos.

Comme vous pouvez le constater plus bas, la page mission comporte en moyenne 8 miniatures de 120px/120px plus une photo équipage de 250px/195px.



Chaque miniature renvoie à une page comportant la photo choisie d'une grandeur de côté en moyenne de 640 px à 1000px.


En résumé, pour chaque page mission sont associée huit pages photos d'un poids en moyenne de 1,5 Mo à 2,5 Mo.

Le projet comporte 134 missions.

Est-ce que cette configuration est viable ?

Je rappelle que le fait de cliquer sur les miniatures ne renvoie pas à un hébergeur d'images mais renvoie à une page XHTML à l'intérieur de ma programation.

Merci pour vos observations

DGFIP
m
0
l
a c 232 L Programmation
10 Avril 2010 20:58:12

Salut,

Il faut voir si tu n'es pas limité par ton hébergeur en taille. Ceux qui sont gratuits fournissent généralement 100 Mo, donc ça serait pas assez pour toutes tes missions.

Sinon, tu peux utiliser des hébergeurs d'images
m
0
l
10 Avril 2010 21:48:33

Merci OmarR.

En ce qui concerne les hébergeurs d'images, il me semble que la programation XHTML/CSS "interdit" ou du moins déconseille l'ouverture de page dans un nouvel onglet.

Peut-tu m'en dire plus ...

Quoi que je crois que certains sujets du forum traitent de cela.

J'irais voir !

Merci
m
0
l
a c 232 L Programmation
10 Avril 2010 23:55:07

Tu peux avoir le lien directe de l'image, et donc, tu n'as pas besoin d'ouvrir des pages dans un nouvel onglet.
Tu peux avoir le même comportement que ce que tu fais sur ton site, comme si c'était une image sur ton serveur, sauf que de faire
<img src="/mondossier/maphoto.jpg" />
Tu fais
<img src="http://monfournisseurd'image/maphoto.jpg" />
m
0
l
11 Avril 2010 00:19:51

Ok, merci bien OmarR

A plus
m
0
l
11 Avril 2010 09:47:23

Bien merci PetitTigre.

Une question :
Je viens de m'inscrire à ImageShack, je vais commencer à héberger mes images et à rentrer les adresses correspondantes dans mes pages XHTML.
Je pense finir et mettre en ligne mon travail aux alentours de Septembre.

Est-ce que les adresses que j'obtiens et intègre dès maintenant dans ma programmation seront toujours actives à la mise en ligne en Septembre ?

Merci et à plus

m
0
l
a c 232 L Programmation
11 Avril 2010 10:43:26

Oui oui. Il ne me semble pas qu'ils les suppriment
m
0
l
11 Avril 2010 13:13:00

ImageShack ne supprime rien.
m
0
l
14 Avril 2010 21:09:54

Bonjour à tous,

La construction des pages du site avance.

Entre la recherche de la documentation sur Internet, la rédaction du texte, le remplacement pour chaques nouvelles pages des données mission et équipage, la recherche des photos, leur redimensionnement, la rédaction des légendes, l'obtention des adresses http:// via ImageShack et leur insertion dans les pages, il me faut trois heures par pages. Je termine ce soir la onzième mission. :cry: 

A ce stade, je m'aperçois que j'ai omis de rajouter l'attribut "alt" à toutes mes vignettes (les photos grand format étant hébergées)

Il semble qu'il soit fortement conseillé de les inscrire dans la balise <img/>.

Est-ce que cela s'impose même si cela concerne des vignettes cliquables ?

Merci de vos réponses.

m
0
l
a c 232 L Programmation
15 Avril 2010 11:23:10

Salut,

L'attribut alt est recommandé pour l'accessibilité vu qu'il permet de mettre un texte lorsque l'image n'est pas disponible, et est nécessaire pour avoir un code compatible XHTML.
Maintenant, ce n'est pas non plus la fin du monde si cet attribut n'y est pas ;) 
Tu peux le rajouter dans tes nouvelles pages si tu veux, et puis si à la fin tu as encore du courage, le corriger dans tes anciennes pages, mais c'est pas grand chose.
m
0
l
15 Avril 2010 18:25:05

Merci, OmarR

Voilà donc chez moi, l'écriture XHTML qui correspondra à une vignette cliquable :

<tr><td><a href="http://img15.imageshack.us/img15/5648/sts41ccrew.jpg"><img src="sts41cdossierphoto/sts41cequipage120x.jpg"alt="Photo équipages STS41C"/></a></td><td>Les cinq membres d'équipage. <br/> (Mission STS-41C) </td></tr>

Merci et à plus
m
0
l
9 Mai 2010 14:41:48

Bonjour à tous,

La fabrication du site avance.
La 35ème mission est dans la boîte.

De façon à tester le site sur le web, j'ai pris un hébergement. Dans un premier temps j'ai pris un nom de sous-domaine gratuit. Un nom de domaine définitif sera choisit à la fin de la construction du site.

Après quelques réglages (uniformisation des adresses liens des pages HTML, surtout en ce qui concerne les petites lettres et les lettres capitales), le site semble donner toutes satisfactions.

Je reviens vers vous car je souhaite donner à l'utilisateur la possibilité, outre le choix d'une mission via la liste déroulante, d'accéder à une des 134 missions de façon aléatoire. L'idéal eut été d'intégrer à chaque page HTML correspondant à une mission, un bouton "mission au hasard".

Après avoir quelque peu cherché dans le forum et sur le web, ce cas de figure semble ne pas être abordé.

Si vous avez des conseils ou des liens, je vous en remercie d'avance.

A bientôt


*message aux modos: Le problème initial de la liste déroulante étant résolu, peut-être que mes posts seraient plus à leur place dans un nouveau sujet. Je vous laisse le soin d'intervenir si nécessaire. Je peux créer un nouveau sujet du type "Création d'un site" ou rebaptiser ce sujet. C'est comme vous voulez. Merci

m
0
l
a c 232 L Programmation
9 Mai 2010 18:46:26

Salut,

Comme tu veux pour le nouveau topic :) 

Sinon, un bouton mission au hasard devrait être assez facile à créer. Le but serait de générer un nombre aléatoire entre 1 et le nombre de pages que tu as. Ensuite, tu sélectionnes la mission correspondant à ce nombre.
m
0
l
9 Mai 2010 19:57:51

Bonjour OmarR

En tapant ma requête dans Chrome, je suis tombé sur cela :



Le script ci-dessous permet de créer un lien hypertexte dirigeant le visiteur vers une adresse choisie au hasard dans une liste.

Le code ci-dessous est à insérer entre les balises <HEAD> et </HEAD> en début de page :

<SCRIPT Language="Javascript">
<!--
function LienAuHasard()
{
Url = new Array;
base = "http://www.commentcamarche.net/";
Url[0] = "index.php3";
Url[1] = "wifi";
Url[2] = "php";
Url[3] = "forum/";

ChoixLien = Math.floor(Math.random() * Url.length);
window.open(base + Url[ChoixLien],'_blank');
}
//-->
</SCRIPT>


Le code ci-dessous est à insérer dans le corps de la page web (quelque part entre les balises <BODY> et </BODY>) pour afficher le lien :
<A Href="#" onClick="LienAuHasard(); return(false)">Lien aléatoire</A>



J'ai intégré cette écriture sur une page HTML, je lui ai substitué l'adresse html de mes pages. Cela ne fonctionnait pas, j'était constamment renvoyé sur la page d'accueil de "commentcamarche". Alors j'ai supprimé l'écriture "htp://www.commentcamarche.net". La recherche aléatoire s'est mise à fonctionner, mais je me doute que cet emplacement n'est pas là par hasard. Est-ce que je peux le laisser en blanc, dois-je y ajouter mon adresse web une fois que je l'obtiendrais ?

Voilà les seuls modifications que j'ai opéré sur l'exemple proposé. Je n'ai pas touché à l'écriture se situant entre les balises <body></body> si ce n'est le "Lien aléatoire" que j'ai remplacé par une image cliquable.

Merci
m
0
l
9 Mai 2010 20:19:43

De façon à tester mon site, j'ai fait un essai de mise en ligne.

Les missions sont visualisables jusqu'à STS-9 via la liste déroulante.

Le site sera disponible dans son intégralité en Septembre

La présentation va encore évoluer.

Si vous avez des observations, cela sera bienvenu.

Lien : www.sts-missionnavettespatiale.net/
m
0
l
a c 232 L Programmation
10 Mai 2010 09:18:41

Salut,

Le plus simple, ça va être de réutiliser les données de ton sélectionneur de mission, comme ça tu n'auras pas besoin de rentrer 2 fois les nombreuses missions ;) 

J'ai repris le code que tu as trouvé, et je l'ai modifié pour que ça fonctionne pour toi (normalement :) )

  1. <script type="text/javascript">
  2. function LienAuHasard()
  3. {
  4. base = "http://www.missionsnavettespatiale.planethoster.org";
  5. options = document.getElementsByName('menu_destination')[0].options;
  6. ChoixLien = Math.floor(Math.random() * options.length);
  7. document.location.href = base + options[ChoixLien];
  8. }
  9. </script>


J'ai utilisé le même nom de fonction, de manière à ce que tu n'aies pas à modifier le HTML.
m
0
l
10 Mai 2010 21:28:55

Salut OmarR,

Je te remercie pour ton post.

Alors voilà ou j'en suis :

Hier avant ton dernier post, voilà de quelle façon j'ai intégré pour essai le script de la fonction aléatoire dans une page HTML.



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>MISSIONS STS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="sts" href="sts.css" />


<!--script bouton au hasard début-->
<SCRIPT Language="Javascript">
<!--
function LienAuHasard()
{
Url = new Array;
base = "";
Url[0] = "sts1.html";
Url[1] = "sts2.html";

Url[2] = "sts3.html";
Url[3] = "sts4.html";
Url[4] = "sts5.html";
Url[5] = "sts6.html";
Url[6] = "sts7.html";
Url[7] = "sts8.html";
Url[8] = "sts9.html";
Url[9] = "sts41b.html";
Url[10] = "sts41c.html";
Url[11] = "sts41d.html";
Url[12] = "sts41g.html";

etc etc ...

ChoixLien = Math.floor(Math.random() * Url.length);
window.open(base + Url[ChoixLien],'_blank');
}
//-->
</SCRIPT>
<!--script bouton au hasard fin-->

</head>

<body>

<!--bouton au hasard début-->
<p class="boutonauhasard">
<a Href="#" onClick="LienAuHasard(); return(false)"><img src="sts1dossier/dossierphotoSTS1/boutonauhasard.jpg" alt="boutonauhasard " title="Cliquez pour atteindre une mission au hasard" border="0"/></a>
</p>


<!--bouton au hasard fin-->


<a href="#haut" name="haut" id="haut"></a>

<div id="en_tete">
</div>
<div id="listederoulante">
<form method="post" action="http://www.monsite.net/redirection_navigation.php">
<p>

<select name="menu_destination" onchange="document.location = this.options[this.selectedIndex].value;">
<option value="inactif">CHERCHER UNE MISSION</option>
<option value="index.html">Accueil</option>
<option value="sts1.html">STS-1 (04/1981)</option>
<option value="sts2.html">STS-2 (11/1981)</option>
<option value="sts3.html">STS-3 (03/1982)</option>
<option value="sts4.html">STS-4 (06/1982)</option>
<option value="sts5.html">STS-5 (11/1982)</option>
<option value="sts6.html">STS-6 (04/1983)</option>


etc etc ...


La fonction donne satisfaction. Bien sûr seulement sur les pages html déjà réalisée. Parfois la fonction aléatoire choisi une page html pas encore réalisées alors le message page introuvable s'affiche. Logique.

Bien sur comme tu me le fait remarquer dans ton message, il m'a fallut ressaisir l'adresse d'une bonne partie des pages missions. Du moins pour le test. Mais j'y reviens dans quelques instants.

Comme tu le remarque, en haut du script et au regard de "base", j'ai supprimé toute adresse car la fonction aléatoire, dans ce cas là ne fonctionne pas. En lisant ton message, j'ai approfondi la chose.

En limitant le "choix lien" à 9 pages HTML(qui est le nombre de missions hébergées actuellement sous l'adresse de sous domaine et en conservant l'adresse en question au regard de la balise "base" comme tu le mentionne dans ton message et surtout en rajoutant un "/" juste après" .org", alors en actionnant le bouton "mission au hasard", je parvient à une mission au hasard parmi les neuf actuellement disponibles sur "missionsnavettespatiale".

Tout ce roman pour dire qu'en définitif, il faudra qu'au regard de la balise "base" je fasse correspondre l'adresse du nom de domaine que je choisirai en septembre.
Maintenant je n'ai pas fait le test d'inclure le script en question directement dans les pages hébergées par PlanetHoster. Il va falloir que je le fasse, comme ca je serai définitivement fixé sur la fiabilité de cette fonction aléatoire. Car entre ce qui se passe sur l'ordi à la maison et se qui se passe une fois chez l'hébergeur, il peut y avoir une différence.

Pour revenir à ton dernier post, j'ai bien compris qu'il pourrait me permettre d'éviter de ressaisir l'ensemble des pages HTML missions. mais je ne sais pas si je dois l'intégrer tel quel dans la page HTML ou si je dois y apporter des modifications. Si tu pouvais me donner des précisions, car je n'est pas encore saisis l'ensemble des 134 missions dans le script de recherche aléatoire et cela peu en valoir la chandelle.

Voilà, j'espère que j'ai pas été trop long.

A plus et merci
m
0
l
a c 232 L Programmation
11 Mai 2010 01:25:16

Tu as juste besoin de remplacer le <script> qui t'a été fourni par le mien et ça devrait marcher correctement :) 

En fait, la variable base te permet de définir un point commun pour toutes les pages afin de ne pas avoir besoin d'écrire par exemple:
Url[0] = "http://www.missionsnavettespatiale.planethoster.org/sts...";
Url[1] = "http://www.missionsnavettespatiale.planethoster.org/sts...";
...

On peut même l'améliorer pour avoir directement le nom de domaine, comme ça, même si tu changes, ça ne posera pas de soucis :

  1. <script type="text/javascript">
  2. function LienAuHasard()
  3. {
  4. base = document.location.protocol + "//" + document.location.hostname + "/";
  5. options = document.getElementsByName('menu_destination')[0].options;
  6. ChoixLien = Math.floor(Math.random() * options.length);
  7. document.location.href = base + options[ChoixLien];
  8. }
  9. </script>
m
0
l
11 Mai 2010 07:47:41

OK, je teste tout cela ce soir,

Merci
m
0
l
21 Mai 2010 21:13:41

Absorbé par la réalisation des pages missions (j'ai pris du retard), je n'ai pu me consacrer sérieusement que ce soir à l'essai du script que tu m'as proposé OmarR. je doit avouer que je rencontre quelques difficultés pour que cela fonctionne. Aussi bien en interne sur mon ordi à la maison que sur le nom de sous domaine.

Du coup, et pour l'instant je reste sur l'option :


<SCRIPT Language="Javascript">
<!--
function LienAuHasard()
{
Url = new Array;
base = "";
Url[0] = "sts1.html";
Url[1] = "sts2.html";
Url[2] = "sts3.html";
Url[3] = "sts4.html";
Url[4] = "sts5.html";
Url[5] = "sts6.html";
Url[6] = "sts7.html";
Url[7] = "sts8.html";
Url[8] = "sts9.html";
Url[9] = "sts41b.html";
Url[10] = "sts41c.html";
Url[11] = "sts41d.html";
Url[12] = "sts41g.html";

etc etc ...

ChoixLien = Math.floor(Math.random() * Url.length);
window.open(base + Url[ChoixLien],'_blank');
}
//-->
</SCRIPT>
<!--script bouton au hasard fin-->


Cela a été un peu long à recopier l'ensemble des pages mission.html mais après il n'a s'agit que de faire des copier coller.

Ce script de "recherche aléatoire d'une page" semble donner satisfaction une fois intégrer aux pages déjà présentes sur le net.

Je pourrai toutefois revenir, comme tu me le proposes, vers une version plus "light" de cette fonction aléatoire, mais pour l'instant je n'ai pas trop de temps à y consacrer. Il me reste beaucoup de travail encore.

Je reviendrai sûrement vers vous car je dois penser à réaliser ma page d'accueil qui devra comporter un moteur de recherche dirigé vers les données de mon site. A contrario de la fonction de recherche aléatoire, l'intégration d'un simple moteur de recherche est abondamment traité sur la toile. Je devrai trouver mon bonheur assez rapidement.

Merci et à plus tard
m
0
l
a c 232 L Programmation
22 Mai 2010 00:33:48

Ok. Bonne continuation.
C'est dommage d'avoir perdu du temps à recopier tout le nom des pages alors que tu pouvais faire ça facilement avec les données fournies. :( 

Dans l'absolu, une meilleure solution pour toi serait d'avoir une base de données, d'avoir un langage serveur (PHP par exemple), afin de générer tes pages automatiquement, mais bon, c'est pas les mêmes connaissances qu'il faut, bien que ce soit quand même assez facile d'accès.
Et tu perdrais certianement moins de temps à faire tout ton site.
m
0
l
2 Septembre 2010 21:02:59

Bonsoir à tous et bonsoir OmarR,

Je reviens vers vous pour vous informer que la fabrication de mon site touche à sa fin.

J'ai passé ces derniers mois à construire les 134 pages de missions navette.

Il y a quelques temps, j'ai pris un nom de sous domaine chez PlanetHoster afin de m'assurer du bon fonctionnement des pages HTML.

Dernièrement, le grand moment est venu. j'ai choisit le nom de domaine du site: http://www.sts-missionnavettespatiale.net/

Et là, catastrophe !!

Etant informé que le temps de propagation d'un nom de domaine peu varié de 24 à 72 heures, le fait de taper directement mon adresse site dans un moteur de recherche ne donne rien.

Je suis conscient que je suis un peu hors sujet avec la rubrique "programmation" de ce fil et que ce soucis et récurant lors des premières mise en ligne, d'ailleurs j'ai une demande de soutien en cours avec PlaneeHoster, mais la chose me parait d'autant plus bizarre que le moteur de recherche de ma page d'accueil refuse de fonctionner avec l'adresse : http://www.sts-missionnavettespatiale.net/ alors qu'il continue à ma proposer des choix sur l'ancien nom de sous-domaine qui n'existe plus d'ailleurs. De plus, le cas est similaire avec la messagerie. Enfin bon, je vais attendre et voir.

Je reviendrais sûrement vers vous pour régler un problème se manifestant à l'ouverture du site sous Firefox. Si certains qui me lisent veulent essayer, vous aller vous apercevoir que les listes déroulantes de la page d'accueil ne s'affiche que partiellement. Il va falloir que je trouve une solution. Grâce à OmarR, * {margin: 0;padding: 0;} est déjà présent dans le CSS et cela harmonise déjà très bien entre IE et Chrome.

Ah, une dernière chose, si vous visitez mon site, le deversement des pages via FileZilla est en cours. L'intégralité des missions seront visualisables d'ici une dizaine de jours.

Je tiens à remercier tous les forumeurs qui ont répondu à mes questions tout au long de ce fil.

A bientôt

DGFIP
m
0
l
2 Septembre 2010 23:19:20

Ouha ! Un travail de passionné, félicitation c'est énorme comme contenu. Tu n'es pas encore indexé sur GG mais cela ne va pas tardé avec le lien que tu as mis, d'ici deux ou trois jours, et je t'ai fais le submit. Fais une description détaillée dans 3 ou 4 annuaires de qualité et ce sera bon pour le premier mois :) 
m
0
l
3 Septembre 2010 16:36:14

Merci smorge,

Je continue à l'heure actuelle les opérations de correction des textes UHTML. Je suis un peu tributaire de la personne qui a accepté de s'occuper de ce travail, mais d'ici 10 jours l'intégralité des missions seront visualisables. Déjà ce soir, j'en intègre quinze de plus. Effectivement, la non indexation chez Google de mon nom de domaine créer le 29 août m'inquiète un peu. Mais je vais faire ce que tu me dis. Je vais me mettre à la recherche de quelques annuaires de qualité. A ce propos, que veut dire le "submit" ?

Merci encore pour ce premier encouragement en attendant, je l'espère, d'en avoir plein d'autres quand le messagerie de http://www.sts-missionnavettespatiale.net/index.html fonctionnera.

DGFIP
m
0
l
3 Septembre 2010 21:16:39

submit avec http://www.google.fr/addurl/ ça permet de demander aux robots indexeurs (googlebot) de venir visiter l'url un de ces jours. J'ai fait gg tu peux faire de même avec yahoo et bing
m
0
l
3 Septembre 2010 22:00:30

OK, merci bien smorge. Pour info, mon adresse commence à sortir sur Google.
A bientôt
m
0
l
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS