Bonjour,
Sur mon site (voir la signature), il y a trois images représentant une station météo.
Je souhaiterais mettre à la place des petites images grises (dans les carrés), les images cliquables de couleur qui sont en dessous.
Et la même chose sur les images grises en ligne au bas de la station.
Mais je ne sais pas comment faire.
Pour l'instant, j'ai mis les petites images cliquables entre les deux images de la station dans une ligne à part.
Je ne mis connais pas trop en informatique, mais avec un modèle et des explications, je dois pouvoir m'en sortir.
Voici l'arborescence de mon site sur mon PC :
Voici les fichiers qui constituent ma page d'accueil :
Voici le code actuel de ma page d'accueil :
Merci de votre aide
Cordialement
Modifié par PoppyGuy (27 Sep 2016 - 07:13)
Sur mon site (voir la signature), il y a trois images représentant une station météo.
Je souhaiterais mettre à la place des petites images grises (dans les carrés), les images cliquables de couleur qui sont en dessous.
Et la même chose sur les images grises en ligne au bas de la station.
Mais je ne sais pas comment faire.
Pour l'instant, j'ai mis les petites images cliquables entre les deux images de la station dans une ligne à part.
Je ne mis connais pas trop en informatique, mais avec un modèle et des explications, je dois pouvoir m'en sortir.
Voici l'arborescence de mon site sur mon PC :
Voici les fichiers qui constituent ma page d'accueil :
Voici le code actuel de ma page d'accueil :
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Météo St Florent des Bois - La Clopinière - La Sicaudiere</title>
<meta content="Guy" name="author">
<script type="text/javascript">
function affichePage()
{
// récupération des données : annee / mois / pages
var annee = document.getElementById('annee').value;
var mois = document.getElementById('mois').value
var pages = document.getElementById('pages').value
if( annee != '' && mois != '' && pages != '' )
{
var url = '/'+ annee + '/' + mois + '/' + pages +'.html';
document.location.href = url; // on affiche la page
}
}
</script>
</head>
<body
style="color: white; background-color: rgb(0, 51, 153); width: 1450px;"
alink="#33ff33" link="#dcd296" vlink="#dcd296">
<h1 style="text-align: center; width: 1450px;"><span style="color: red;">M</span><span
style="color: rgb(51, 255, 51);">é</span><span
style="color: rgb(255, 255, 51);">t</span><span
style="color: rgb(102, 255, 255);">é</span><span
style="color: rgb(204, 51, 204);">o</span> "St Florent des bois"
- "La Clopinière" - "La Sicaudière"</h1>
<h2 style="text-align: center; width: 1450px;">Commune des "Rives de
L'Yon"</h2>
<div style="text-align: center;"><a
href="mailto:st-florent-meteo-clopiniere@akeonet.com"><img
style="border: 0px solid ; width: 50px; height: 39px;" alt="Messagerie"
src="Icones/Messagerie.gif"></a>
<br>
</div>
<br>
<div style="text-align: center; width: 1450px;">Relevés météo avec une
station
amateur "Oregon WMR200" placée à "La Clopinière"<br>
<big><span style="color: yellow;">Il y a la possibilité de voir les
relevés effectués depuis 2011
</span></big><br>
<span style="color: rgb(51, 255, 51);">Pressions - Températures -
Hauteur de pluie - Vitesse de Vent - Heures de Soleil</span><br>
<span style="color: white;"></span><br>
<span style="color: yellow;">La date et l'heure de la station
ci-dessous indique la dernière mise à jour</span><br
style="color: yellow;">
</div>
<br>
<div style="text-align: center; width: 1450px;">
<!-- liste déroulante pour les années -->
<select id="annee" name="annee" size="1" onchange="affichePage();">
<option value="">Choisir une Année</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
<option value="2012">2012</option>
<option value="2011">2011</option>
</select>
<!-- liste déroulantes pour les mois -->
<select id="mois" name="mois" size="1" onchange="affichePage();">
<option value="">Choisir un mois</option>
<option value="Janvier">Janvier</option>
<option value="Fevrier">Fevrier</option>
<option value="Mars">Mars</option>
<option value="Avril">Avril</option>
<option value="Mai">Mai</option>
<option value="Juin">Juin</option>
<option value="Juillet">Juillet</option>
<option value="Aout">Aout</option>
<option value="Septembre">Septembre</option>
<option value="Octobre">Octobre</option>
<option value="Novembre">Novembre</option>
<option value="Decembre">Decembre</option>
</select>
<!-- liste déroulante pour les pages -->
<select id="pages" name="pages" size="1" onchange="affichePage();">
<option value="">Choisir une page</option>
<option value="Pluie">Pluie</option>
<option value="Pressions">Pressions</option>
<option value="Soleil">Soleil</option>
<option value="Temperatures">Temperatures</option>
<option value="Vent">Vent</option>
</select>
</div>
<br>
<div style="text-align: center; width: 1450px;"><img
style="width: 800px; height: 200px;" alt="Septembre"
src="Septembre.jpg"><br>
<br>
<div style="text-align: center;">
<div style="font-weight: bold;"><a href="2016/Janvier/Pluie_Soleil.html"><span
style="text-decoration: underline;"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Janvier"
src="Icones/Bouton_Janvier.png"></span></a> <a
href="2016/Fevrier/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Fevrier"
src="Icones/Bouton_Fevrier.png"></a>
<a href="2016/Mars/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Mars"
src="Icones/Bouton_Mars.png"></a> <a
href="2016/Avril/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Avril"
src="Icones/Bouton_Avril.png"></a> <a
href="2016/Mai/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Mai"
src="Icones/Bouton_Mai.png"></a> <a
href="2016/Juin/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Juin"
src="Icones/Bouton_Juin.png"></a> <a
href="2016/Juillet/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="Bt_Juillet"
src="Icones/Bouton_Juillet.png"></a> <a
href="2016/Aout/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 71px; height: 29px;" alt="BT_Août"
src="Icones/Bouton_Aout.png"></a> <a
href="2016/Septembre/Pluie_Soleil.html"><img
style="border: 0px solid ; width: 90px; height: 29px;" alt="Septembre"
src="Icones/Bouton_Septembre.png"></a><br>
</div>
<div style="width: 1450px;"><br>
<img
style="width: 650px; height: 350px;"
alt="Précipitations et Statistiques" src="Precipitations.jpg"><br>
<br>
<img src="WMR200-2.jpg" alt="Station GW"
style="width: 791px; height: 557px;"><br>
<h2>Ensoleillement du jour en cours</h2>
<img style="width: 901px; height: 564px;" alt="Soleil"
src="Ensoleillement.JPG"><br>
<h2><br>
</h2>
<h2>Température - Pression - Humidité - Vent et Statistiques du jour en
cours</h2>
<img src="GraphWeather.jpg" alt="GW"
style="width: 800px; height: 700px;"><br>
<h2><br>
</h2>
<img style="width: 792px; height: 548px;" alt="Station mois"
src="WMR200_Mois_Excel.png"><br>
<div style="text-align: left;">
Cliquer
--> <a
href="2016/Septembre/Pressions.html"><img
style="border: 0px solid ; width: 30px; height: 30px;"
alt="Icone Terre" src="Icones/Terre_Station.png"></a>
<a
href="2016/Septembre/Pluie.html"><img
style="border: 0px solid ; width: 30px; height: 30px;"
alt="Icone Pluie" src="Icones/Pluie_Station_Blanc.png"></a>
<a
href="2016/Septembre/Soleil.html"><img
style="border: 0px solid ; width: 30px; height: 29px;"
alt="Icone Soleil" src="Icones/Soleil_Station.png"></a>
<img
style="width: 26px; height: 26px;" alt="Horloge"
src="Icones/Horloge_Station.png">
<a
href="2016/Septembre/Temperatures.html"><img
style="border: 0px solid ; width: 13px; height: 30px;"
alt="Icone Thermomètre" src="Icones/Temperature_Station.png"></a>
<a
href="2016/Septembre/Humidite.html"><img
style="border: 0px solid ; width: 19px; height: 30px;"
alt="Icone Humidité" src="Icones/Humidite_Station.png"></a>
<a
href="2016/Septembre/Vent.html"><img
style="border: 0px solid ; width: 42px; height: 30px;" alt="Icone Vent"
src="Icones/Vent_Station.png"></a>
<img style="width: 21px; height: 25px;"
alt="Graphique" src="Icones/Graphique_Station.png"><br>
</div>
<img style="width: 794px; height: 553px;" alt="Station Année"
src="WMR200_Annee_Excel.png"><br>
<br>
<br>
<h2>Graphique des précipitations du mois en cours</h2>
<img style="width: 910px; height: 451px;" alt="Graphique Pluie"
src="Pluie.png"><br>
<br>
<br>
<br>
<h2>Graphique des heures de Soleil du mois en cours</h2>
<img src="Soleil.png" alt="Graphique Soleil"
style="width: 910px; height: 451px;"><br>
<br>
<br>
<h2>Graphique de la Vitesse du Vent du mois en cours</h2>
<img style="width: 910px; height: 451px;" alt="Graphique Vent"
src="Vitesse_Vent.png"><br>
<br>
<br>
<br>
<h4><big><big>Nombre de jours et d'heures
de <span style="color: rgb(51, 204, 0);">Pluie</span>, de <span
style="color: yellow;">Soleil</span>, et de <span
style="color: rgb(255, 204, 153);">Vent</span> du mois en cours<br>
</big></big></h4>
<big><big>
<span style="text-decoration: underline;"></span><img
style="width: 910px; height: 554px;" alt="Mois" src="Mois.png"><br>
</big></big>
<big><big><br>
</big>
</big>
<h4><big><big>Mini et Maxi du mois en cours<br>
</big></big></h4>
<big><big>
<img style="width: 910px; height: 454px;" alt="Mini Maxi"
src="Mini_Maxi.png"><br>
</big></big>
<br>
<br>
<br>
<big><big>
</big></big></div>
</div>
</div>
</body>
</html>
Merci de votre aide
Cordialement
Modifié par PoppyGuy (27 Sep 2016 - 07:13)
