liste deroulante sans blocage

Deuxième conseil : bannir la pop-up en dehors d'un usage applicatif.
et comment on fait des listes deroulantes sans popup ?

1) Normalement, ça doit fonctionner sans JS
2) normalement (avec ou sans JS) ça doit passer à l'autre page
3) éventuellement (JS ou pas) ça peut ouvrir dans une autre fenêtre
4) ... ça peut ! ce n'est pas forcé que ça le fasse ...
(suivant le réglage du navigateur du visiteur il est possible que la
nouvelle fenêtre ne soit pas autorisée, ou que le fichier s'ouvre
dans un onglet)


cas 2 :

<form action="suivant.php" onsubmit="return suivante(this);">
Menu : <select name=page>
<option value="../pages/p_1.htm">menu 1</option>
<option value="../pages/p_2.htm">menu 2</option>
<option value="../photos/p_1.jpg">vue 1</option>
</select>
<input type=submit>
</form>
<script type="text/javascript">
function suivante(monform) {
var k = document.monform.page.selectedIndex;
location = document.monform.page.options[k].value;
return false;
}
</script>

cas 3 :

<form action="suivant.php" onsubmit="return suivante(this);" target="autre">
Menu : <select name=page>
<option value="../pages/p_1.htm">menu 1</option>
<option value="../pages/p_2.htm">menu 2</option>
<option value="../photos/p_1.jpg">vue 1</option>
</select>
<input type=submit>
</form>
<script type="text/javascript">
function suivante(monform) {
var p = document.monform.page.value;
document.monform.action = p;
if(typeof autre == 'undefined || autre.closed)
autre = window.open('','autre','widthP0,heightP0,resizable=1');
autre.focus();
return true;
}
</script>

Dans les 2 cas le fichier 'suivant.php' devra récupérer le contenu de
'page' pour faire suivre vers le bon fichier (au cas où le JS serait
désactivé).

Dans le cas 3, il est possible que le fichier appelé s'affiche dans un
onglet au lieu d'un popup. Le visiteur va pas apprécier de voir sa
fenêtre principale de navigateur se redimensionner !!!!


Le mieux est encore de ne pas popupper et de travailler avec de bêtes
liens :

<dl id="menu">
<dt>Menu</dt>
<dd><a href="p1.htm">menu 1</a></dd>
<dd><a href="p2.htm">menu 2</a></dd>
<dd><a href="p3.htm">menu 3</a></dd>
</dl>
<style type="text/css">
#menu.menu dd { display: none }
#menu.menu dt { cursor: pointer; _cursor: hand }
#menu.menu:hover dd { display: block }
#menu { width: 9em }
#menu a { display: block; text-decoration: none; text-align: center;
background: #ff5 }
#menu a:hover { background: gold }
</style>
<script type="text/javascript">
window.onload = function() {
var M = document.getElementById('menu');
M.className = 'menu';
var IEúlse; /*@cc_on IE=true; @*/
if(IE) {
M.onmouseover = function() { this.className=''; };
M.onmouseout = function() { this.className='menu'; };
}
}
</script>


--
sm

On Fri, 25 Apr 2008 17:05:06 +0200, SAM
<stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

bonjour tous,
j'ai une liste deroulante ,
voir http://www.avf-neuilly92.asso.fr/vousarrivez.htm
vous remercie par avance de vos suggestions
qu'est ce que veut dire :

(cliquer sur un des pictos ci-contre)
?

Donc ... je n'ai pas à savoir ce que c'est ?

merci pour ce bouquet de produits,

de rien.

mais où est la réponse à la question initiale ?

Le bouquet était la réponse !

Qant à un menu par liste déroulante :
ça *DOIT* fonctionner *sans* javascript !

donc ...

1) le bouton de submit doit figurer
2) pas de popup car de nos jours c'est très mal vu
(merci de ne pas toucher à nos fenêtres de navigateur)
(personne ne se mêle de bricoler ton Word pendant que tu y tapotes)


un truc :

<p><a href="#" onclick="return false">menu 1
<span><strong>blabla 1</strong><br>
petit texte 1.1<br>
petit texte 1.2
</span></a>
<p><a href="#" onclick="return false">menu 2
<span><strong>blabla 2</strong><br>
petit texte 2.1<br>
petit texte 2.2
</span></a>

<style type="text/css">
p a { text-decoration: none; }
p a span { display: none; border: 1px solid; color: maroon;
position: absolute; top: 50px; left: 100px; width: 300px;
background: #ffc; padding: 6px; }
p a:hover span { display: block; z-index: 99 }
</style>


--
sm

bpdu92 avait soumis l'idée :

bonjour tous,
j'ai une liste deroulante ,
un clic sur chaque element ouvre une fenetre, rien d'extraordinaire
voir http://www.avf-neuilly92.asso.fr/vousarrivez.htm, clic/programme
mais certains IE bloquent avec Pour vous aider à proteger.....
et l'internaute doit cliquer 2 fois pour autoriser l'affichage de la
fenetre
peut-on eviter ce blocage fastidieux, sans obliger l'internaute
à modifier les reglages secu de son IE ?
autre soluce que window.open ?, parametrage different ?

vous remercie par avance de vos suggestions

La solution serait de ne pas utiliser de liste déroulante classique
(SELECT), quitte à réinventer la roue. Par ex, tu fais un DIV dans
lequel tu places tes liens (<A href="javascript:;"
onclick="window.open(...)">), avec une scrollbar si tu veux
(style="overflow-y:hidden").
Et là, ce sera des liens classiques, donc tu pourras faire une
ouverture de popup en 1 clic, sans le problème que tu rencontres
actuellement.

--
Olivier Ligny

bpdu92 avait soumis l'idée :

bonjour tous,
j'ai une liste deroulante ,
un clic sur chaque element ouvre une fenetre, rien d'extraordinaire
voir http://www.avf-neuilly92.asso.fr/vousarrivez.htm, clic/programme
mais certains IE bloquent avec Pour vous aider à proteger.....
et l'internaute doit cliquer 2 fois pour autoriser l'affichage de la
fenetre
peut-on eviter ce blocage fastidieux, sans obliger l'internaute
à modifier les reglages secu de son IE ?
autre soluce que window.open ?, parametrage different ?

vous remercie par avance de vos suggestions

La solution serait de ne pas utiliser de liste déroulante classique
(SELECT), quitte à réinventer la roue. Par ex, tu fais un DIV dans
lequel tu places tes liens (<A href="javascript:;"
onclick="window.open(...)">), avec une scrollbar si tu veux
(style="overflow-y:hidden").
Et là, ce sera des liens classiques, donc tu pourras faire une ouverture
de popup en 1 clic, sans le problème que tu rencontres actuellement.

Je me demande bien ce que le faux select apporte de plus(*) que le vrai
quant à la question faut-il ou non avoir un popup et à celle relative :
permettre au popup de s'ouvrir malgré la mauvaise volonté du brouteur.
(dans les 2 cas on utilise du JS pour popupper)

Si l'on oublie la question 2 la liste déroulante auto est facile à faire:

<select onchange="var k = this.selectedIndex;
if(k==0) alert('faire un choix dans la liste');
else pop(this.options[k].value);">
<option selected>menu</option>
<option value="p1.htm">page 1</option>
<option value="p2.htm">page 2</option>
<option value="p3.htm">page 3</option>
</select>


function pop(url) {
if(typeof truc == 'undefined' || truc.closed)
truc="window.open('','','widthP0,heightP0');
truc.location=url;
truc.focus();
return false;
}


(*) la soluce par <a href="javascript:pop('p1.hm')"
est à proscrire absolument ! ! !
Utiliser :
<a href="p1.htm" onclick="return pop(this.href);"

Pour le select se servir du form pour le suivi du menu vers une page php
ou une html sans JS (comme montré dans autres exemples précédents).


--
sm

On Sat, 26 Apr 2008 17:34:22 +0200, O.L. <null@undefined.invalid>
wrote:

La solution serait de ne pas utiliser de liste déroulante classique
(SELECT), quitte à réinventer la roue. Par ex, tu fais un DIV dans
lequel tu places tes liens (<A href="javascript:;"
onclick="window.open(...)">), avec une scrollbar si tu veux
(style="overflow-y:hidden").
si u as un exemple plus complet ?

merci d'avance

On Sat, 26 Apr 2008 17:57:30 +0200, SAM
<stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

bpdu92 avait soumis l'idée :

bonjour tous,
j'ai une liste deroulante ,
un clic sur chaque element ouvre une fenetre, rien d'extraordinaire
voir http://www.avf-neuilly92.asso.fr/vousarrivez.htm, clic/programme
mais certains IE bloquent avec Pour vous aider à proteger.....
et l'internaute doit cliquer 2 fois pour autoriser l'affichage de la
fenetre
peut-on eviter ce blocage fastidieux, sans obliger l'internaute
à modifier les reglages secu de son IE ?

Si l'on oublie la question 2 la liste déroulante auto est facile à faire:

<select onchange="var k = this.selectedIndex;
if(k==0) alert('faire un choix dans la liste');
else pop(this.options[k].value);">
<option selected>menu</option>
<option value="p1.htm">page 1</option>
<option value="p2.htm">page 2</option>
<option value="p3.htm">page 3</option>
</select>


function pop(url) {
if(typeof truc == 'undefined' || truc.closed)
truc="window.open('','','widthP0,heightP0');
truc.location=url;
truc.focus();
return false;
}


(*) la soluce par <a href="javascript:pop('p1.hm')"
est à proscrire absolument ! ! !
Utiliser :
<a href="p1.htm" onclick="return pop(this.href);"

Pour le select se servir du form pour le suivi du menu vers une page php
ou une html sans JS (comme montré dans autres exemples précédents).
j'ai essayé

<BODY>
<SCRIPT LANGUAGE="JavaScript">
function pop(url) {
if(typeof truc == 'undefined' || truc.closed)
truc="window.open('','','widthP0,heightP0');
truc.location=url;
truc.focus();
return false;
}
// --></SCRIPT>
<FORM name=form1>
<select onchange="var k = this.selectedIndex;
if(k==0) alert('faire un choix dans la liste');
else pop(this.options[k].value);">
<option selected>menu</option>
<option value="p1.htm">page 1</option>
<option value="p2.htm">page 2</option>
<option value="p3.htm">page 3</option>
</select></form>
</BODY></HTML>

qui ne marche pas,
votre meilleur remède, docteur ?
merci d'avance

votre meilleur remède, docteur ?
merci d'avance

<html>
<script type="text/javascript">
function pop(url) {
if(typeof truc == 'undefined' || truc.closed)
truc=window.open('','','widthP0,heightP0');
truc.location=url;
truc.focus();
return false;
}
</script>
<form>
<select onchange="var k = this.selectedindex;
if(k==0) alert('faire un choix dans la liste');
else pop(this.options[k].value);">
<option selected>menu</option>
<option value="p1.htm">page 1</option>
<option value="p2.htm">page 2</option>
<option value="p3.htm">page 3</option>
</select>
</form>
</html>


mais ça ne résout pas :
- et si le JS est désactivé ?
- et si le brouteur refuse les popups ?

--
sm

votre meilleur remède, docteur ?
merci d'avance

<html>
<script type="text/javascript">
function pop(url) {
if(typeof truc == 'undefined' || truc.closed)
truc=window.open('','','widthP0,heightP0');
truc.location=url;
truc.focus();
return false;
}
</script>
<form>
<select onchange="var k = this.selectedIndex;
if(k==0) alert('faire un choix dans la liste');
else pop(this.options[k].value);">
<option selected>menu</option>
<option value="p1.htm">page 1</option>
<option value="p2.htm">page 2</option>
<option value="p3.htm">page 3</option>
</select>
</form>
</html>


mais ça ne résout pas :
- et si le JS est désactivé ?
- et si le brouteur refuse les popups ?


--
sm

On Tue, 29 Apr 2008 20:52:00 +0200, SAM
<stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:

<html>
<script type="text/javascript">
function pop(url) {
ok, j'avais laissé trainer un ",

merci et shame on me

mais ça ne résout pas :
- et si le JS est désactivé ?
- et si le brouteur refuse les popups ?
en effet,

comment faire pour etre independant des blocages du navigateur ?
merci d'avance

comment faire pour etre independant des blocages du navigateur ?
merci d'avance

ne pas utiiser de popup (nième redite)
voir :
<http://www.huddletogether.com/projects/lightbox2/>
par exemple

ou imaginer qquechose dans le genre mais plus simple.

--
sm