Les Ancres et les SELECT

par **Tessai** » 27 janv. 2006, 10:53

ça y est j'ai trouvé !

<form action="mapage.php">
...
<a id="ahdd"></a>
<input value="Add HDD" onclick="form.action='mapage.php#ahdd'">
</form>

Et hop le tour est joué 8)

Merci à tous !

par **Tessai** » 26 janv. 2006, 14:37

Cyrano,

Je vois ce que tu veux dire.... mais je ne vois pas comment y arriver

Donc il faudrait que lorsque ma page se recharge je rajoute à mon url #mon_ancre

Seulement là je suis bloqué sur la technique... vu que j'ai un seul formulaire pour toute ma page et que mon ACTION se fait dessus... comment faire pour que chaque champ ai la possibilité de modier l'url ?

Un petit coup de main ?

par **sadeq** » 26 janv. 2006, 14:13

Même si ce n'est pas le thème de la question, J'ai amélioré le code de cyrano pour afficher toujours le menu en haut de la page même si celle-ci se déroule pour atteindre un ancre.

L'idée est de positionner le menu déroulant dans le top du body à chaque nouvelle navigation.
Code javascript :

Code : Tout sélectionner

menu.style.top=body.scrollTop;

Mais pour que le menu change de position un style "position:absolute" est nécéssaire.

Code : Tout sélectionner

<?xml version="1.0" encoding="iso-8859-1" ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" /> 
<title>Navigation par menu déroulant</title> 
<meta http-equiv="Content-language" content="FR-fr" xml:lang="fr" dir="ltr" /> 
<style type="text/css"> 
/* <![CDATA[ */ 
#naviguer { 
    width: 250px; 
    float: left; 
} 
#principal { 
    margin-left: 255px; 
} 
#naviguer legend { 
    font-size: 0.8em; 
    font-weight: bold; 
} 
/* ]]> */ 
</style> 
</head> 
<body> 
  <fieldset id="menu" style="position:absolute; top:0; left:0"> 
    <legend>Navigation</legend> 
    <select name="article" id="article" onchange="window.location.href='#'+this.value; "> 
      <option value="-1">Choisissez un article</option> 
      <option value="bloc1">Premier article</option> 
      <option value="bloc2">Second article</option> 
      <option value="bloc3">Troisième article</option> 
      <option value="bloc4">Quatrième article</option> 
    </select> 
  </fieldset> 
<div id="principal"> 
  <div id="bloc1"> 
    <h3>Premier article</h3> 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p> 
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p> 
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p> 
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p> 
  </div> 
  <div id="bloc2"> 
    <h3>Second article</h3> 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p> 
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p> 
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p> 
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p> 
  </div> 
  <div id="bloc3"> 
    <h3>Troisième article</h3> 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p> 
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p> 
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p> 
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p> 
  </div> 
  <div id="bloc4"> 
    <h3>Quatrième article</h3> 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p> 
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p> 
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p> 
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p> 
  </div> 
</div> 
</body> 

</html>

par **Cyrano** » 26 janv. 2006, 12:59

Alors ajoute un paramètre dans l'url, récupère-le et exploite-le pour mettre le focus dans la zone souhaitée dans ton formulaire.

par **Tessai** » 26 janv. 2006, 12:50

Oui en effet ça fonctionne bien mais ce n'est pas ce que je cherche, donc je vais mettre un petite image pour mieux expliquer :

Donc au niveau de HDD si clique dans mon SELECT j'ai plusieurs cadence de CPU.
Si mon nouvel utilisateur a un CPU différent faut que je le rajoute.

Je click donc sur mon BOUTON Add new hdd

Et quand je fais ça.... et bien ma page ajoute le bouton Add it ! mais voilà... ma page se recharge et je reviens tout au dessus de ma page... donc loin de là ou j'étais...

Je voudrais donc trouver un moyen de me repositionner là ou j'étais après avoir clické sur mon BOUTON

Merci d'avance

par **Cyrano** » 25 janv. 2006, 21:18

Voilà un code fonctionnel pour naviguer dans une page avec un menu déroulant. Un peu long, mais c'est pour obliger à avoir une barre de défilement vertical et une visualisation de l'effet:

<?xml version="1.0" encoding="iso-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" xml:lang="fr" />
<title>Navigation par menu déroulant</title>
<meta http-equiv="Content-language" content="FR-fr" xml:lang="fr" dir="ltr" />
<style type="text/css">
/* <![CDATA[ */
#naviguer {
    width: 250px;
    float: left;
}
#principal {
    margin-left: 255px;
}
#naviguer legend {
    font-size: 0.8em;
    font-weight: bold;
}
/* ]]> */
</style>
</head>
<body>
<form action="#" method="post" id="naviguer">
  <fieldset>
    <legend>Navigation</legend>
    <select name="article" id="article" onchange="if(this.value != -1){window.location='navigselect.html#'+ this.value +'';}">
      <option value="-1">Choisissez un article</option>
      <option value="bloc1">Premier article</option>
      <option value="bloc2">Second article</option>
      <option value="bloc3">Troisième article</option>
      <option value="bloc4">Quatrième article</option>
    </select>
  </fieldset>
</form>
<div id="principal">
  <div id="bloc1">
    <h3>Premier article</h3>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p>
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p>
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p>
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p>
  </div>
  <div id="bloc2">
    <h3>Second article</h3>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p>
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p>
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p>
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p>
  </div>
  <div id="bloc3">
    <h3>Troisième article</h3>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p>
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p>
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p>
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p>
  </div>
  <div id="bloc4">
    <h3>Quatrième article</h3>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi vestibulum euismod magna. Proin egestas nibh et metus. Quisque fermentum massa at diam. Donec eu elit vitae est laoreet bibendum. Nam aliquet neque ac diam. Pellentesque iaculis sapien vitae enim. Suspendisse accumsan dui sit amet lacus. Nunc commodo, est id convallis pharetra, magna ante tempus metus, ac feugiat massa lacus non elit. Aliquam consequat, eros non sodales lobortis, wisi felis malesuada dolor, non luctus lacus neque ac enim. Proin feugiat bibendum dolor. Nunc diam nunc, vehicula et, auctor id, facilisis sit amet, mi. Nunc nulla. Vivamus quis dolor non est suscipit tempus. Suspendisse eu dui sed est cursus dictum. Sed rhoncus enim ut libero.</p>
    <p>Vivamus vitae tortor. Duis ipsum. Quisque diam tortor, ullamcorper non, commodo sed, volutpat at, dolor. Phasellus semper tellus vitae enim. Suspendisse potenti. In in libero et neque vehicula iaculis. Cras dui tortor, vestibulum in, porta consequat, auctor non, neque. Vivamus sem tortor, consequat et, facilisis sit amet, luctus non, mauris. Aliquam lorem sem, pharetra eget, elementum eu, scelerisque molestie, risus. Mauris vehicula mauris nec metus. Quisque justo sapien, porta quis, blandit id, imperdiet eu, felis. Cras nulla. </p>
    <p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec tortor neque, porta vel, facilisis sed, condimentum eget, sapien. Ut ut justo. Suspendisse potenti. Vestibulum dapibus auctor sapien. Pellentesque cursus, elit quis adipiscing luctus, urna pede lacinia pede, sed vehicula lectus sapien tempor nulla. Nullam pulvinar. Quisque tellus wisi, pharetra vel, rhoncus nec, aliquam vel, diam. Phasellus odio massa, cursus vitae, laoreet quis, vulputate ac, massa. Curabitur condimentum condimentum nunc. Nam posuere, magna ut sollicitudin sollicitudin, nunc mi venenatis odio, id condimentum metus eros vel augue. Proin quis erat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut quis pede. Donec eu velit et tortor imperdiet suscipit. Nulla facilisi. Nunc eu urna lobortis mi ultrices fermentum.</p>
    <p>Suspendisse commodo sagittis lectus. Sed posuere mauris non sapien. Morbi massa libero, vehicula faucibus, vestibulum eu, porta ut, eros. Pellentesque nulla libero, volutpat vel, egestas sit amet, accumsan dapibus, ligula. Ut condimentum mauris non nulla. Praesent auctor commodo neque. Vestibulum eget orci nec ante egestas tempus. Nunc iaculis lacinia orci. Nullam nec urna. Vestibulum tempus vestibulum velit. Pellentesque ultrices auctor mi. Curabitur massa turpis, tempus vel, tristique adipiscing, pellentesque vel, quam. Vivamus rhoncus augue sed diam. Phasellus ipsum tortor, consectetuer non, vestibulum et, dictum at, tortor. Nulla neque. Vivamus varius nulla.</p>
  </div>
</div>
</body>
</html>

Copie-ça tel-quel et enregistre ça sous navigselect.html puis teste directement, IE ou FIrefox à ton choix, ça fonctionne partout.

par **Tessai** » 25 janv. 2006, 17:35

a marche po

par **Elie** » 25 janv. 2006, 15:09

Et si tu utilisais :

Code : Tout sélectionner

onclick="location.href = 'tapage.php#tonancre'"

par **Tessai** » 24 janv. 2006, 12:34

Bonjour tout le monde,

J'ai un question existencielle

Dans une page qui est relativement longue, j'ai plusieurs SELECT et dans si jamais je ne trouve pas ce que je veux dans un de ces SELECT j'ai ajouté la possibilité de rajouter des champs dans le SELECT en question.

Jusque là pas de soucis... ça marche...

Le hic est que si ce fameux ajout doit se faire tout en bas de la page, une fois ajouté ma page se recharge mais revient tout en haut...

Ce n'est pas très pratique donc j'aurais voulu savoir ce que je pouvais faire ?

Je me doutes qu'il faut que je rajoute une ancre là ou je veux revenir mais comment la mettre dans mon code ?

J'avais pensé à du Javascript :

onclick="document.navigate(admin.php#mon_ancre)"

Mais ça marche pô

Qq1 aurait une idée pour me sortir de ce mauvais pas ?

Merciiii !

Les Ancres et les SELECT

Répondre

Étendre la vue Revue du sujet : Les Ancres et les SELECT

Les Ancres et les SELECT