Salut.

J'ai des pages Web qui effectuent des traitements asynchrones lors de la
validation de leur formulaires.

Une fois le formulaire validé, j'affiche une DIV en haut à droite du
navigateur pour indiquer l'état du traitement. Cependant, la page peut être
revalidée ou les champs modifiés.

Je désactive donc les contrôles du formulaire via disabled. Cependant, je
suis *fatigué* de devoir coder tout ça pour chaque page.

Est-il possible d'écrire une fonction générique désactivant tous les INPUT
(textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle parcourt tous
les contrôles de la page et les désactive...

Autre question : pensez-vous qu'il soit judicieux de désactiver aussi les
liens ?

En vous remerciant.

--
Delf

Delf a couché sur son écran :

> Est-il possible d'écrire une fonction générique désactivant tous les INPUT
> (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle parcourt tous
> les contrôles de la page et les désactive...

Problème, si j'ai déjà des contrôles désactivés, je les perds lors de
la réactivation...

Autre question : comment mettre un voile transparent sur l'ensemble de
la page ?

Merci.

--
Delf

Delf a couché sur son écran :

> Est-il possible d'écrire une fonction générique désactivant tous les INPUT
> (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle parcourt tous
> les contrôles de la page et les désactive...

Problème, si j'ai déjà des contrôles désactivés, je les perds lors de
la réactivation...

Autre question : comment mettre un voile transparent sur l'ensemble de
la page ?

Merci.

--
Delf

Delf a écrit :

> Problème, si j'ai déjà des contrôles désactivés, je les perds lors de la
> réactivation...

Ben faut gérer ça.

> Autre question : comment mettre un voile transparent sur l'ensemble de
> la page ?

Un div en absolute qui fait 100 % de la page. Mais ça, c'est plutôt à
voir sur <news:fr.comp.infosystemes.www.auteurs>

--
Mickaël Wolff aka Lupus Michaelis
http://lupusmic.org

Delf a écrit :

> Problème, si j'ai déjà des contrôles désactivés, je les perds lors de la
> réactivation...

Ben faut gérer ça.

> Autre question : comment mettre un voile transparent sur l'ensemble de
> la page ?

Un div en absolute qui fait 100 % de la page. Mais ça, c'est plutôt à
voir sur <news:fr.comp.infosystemes.www.auteurs>

--
Mickaël Wolff aka Lupus Michaelis
http://lupusmic.org

Delf a écrit :
> J'ai des pages Web qui effectuent des traitements asynchrones lors de la
> validation de leur formulaires.
>
> Une fois le formulaire validé, j'affiche une DIV en haut à droite du
> navigateur pour indiquer l'état du traitement. Cependant, la page peut être
> revalidée ou les champs modifiés.
>
> Je désactive donc les contrôles du formulaire via disabled. Cependant, je
> suis *fatigué* de devoir coder tout ça pour chaque page.
>
> Est-il possible d'écrire une fonction générique désactivant tous les INPUT
> (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle parcourt tous
> les contrôles de la page et les désactive...

function desactive(frm)
{
var i, E;
for ( i = frm.elements.length; i--; )
{
E = frm.elements[i];
// si l'élément a la classe "keepActive"
// alors ne rien faire
if ( /\bkeepActive\b/.test(E.className) ) { continue; }
E.oldDisabled = E.disabled || null;
E.disabled = true;
}
}

function active(frm)
{
var i, E;
for ( i = frm.elements.length; i--; )
{
E = frm.elements[i];
if ( /\bkeepActive\b/.test(E.className) ) { continue; }
E.disabled = E.oldDisabled;
}
}

<form>
<input type="button" onclick="desactive(this.form)" class="keepActive"
value="Deactivate">
<input type="button" onclick="active(this.form)" class="keepActive"
value="Activate">
<br>
<input type="text">
<input type="text" disabled="disabled">
<br>
<textarea></textarea>
<textarea disabled="disabled"></textarea>
<br>
<input type="checkbox" name="y" value="1">
<input type="checkbox" name="y" value="2" disabled="disabled">
<br>
<input type="radio" name="x" value="1">
<input type="radio" name="x" value="2" disabled="disabled">
<br>
<select><option>0</option></select>
<select disabled="disabled"><option>1</option></select>
</form>

> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi les
> liens ?

Dans ce cas autant mettre un gros div qui intercepte les clicks par
dessus tout le monde plutot que de s'embêter avec chaque élément. Parce
que après les liens, ca va être les éléments avec un event mouseover,
click ou autre qu'il va falloir tracker. Trop fatiguant imo.

function divAntiClick()
{
var
div = document.createElement('div'),
dS = div.style,
dB = document.body;
// interdit les clicks
div.onclick = function() { return false; };
dS.opacity = 0.25;
// opacité pour IE
/*@cc_on dS.filter = 'alpha(opacity=25)'; @*/
dS.backgroundColor = 'black';
dS.position = 'absolute';
dS.top = '0px';
dS.left = '0px';
dS.width = '100%';
dS.zIndex = 1e6;
// enregistre l'état d'overflow avant modif
dB.oldOverflow = dB.style.overflow;
// supprime l'overflow pour empêcher le user
// de servir des scrollbars. Ne pas oublier
// lors de la réactivation de replacer l'overflow
// à sa valeur initiale stockée dans oldOverflow
dB.style.overflow = 'hidden';
// détermine la hauteur du div, cf fonction suivante
dS.height = getViewportHeight() + 'px';
// ajoute enfin le div
dB.appendChild(div);
}

/**
* Returns the current height of the viewport.
* @return {Int} The height of the viewable area
* of the page (excludes scrollbars).
*/
function getViewportHeight()
{
var
IE = /*@cc_on !@*/false,
height = -1;

// IE, Gecko
if ( ( document.compatMode || IE ) && !window.opera )
{
// Standards mode
if ( document.compatMode === 'CSS1Compat' )
{
height = document.documentElement.clientHeight;
}
// Quirks
else { height = document.body.clientHeight; }
}
// Safari, Opera
else { height = self.innerHeight; }

return height;
}

--
laurent

Delf a écrit :
> J'ai des pages Web qui effectuent des traitements asynchrones lors de la
> validation de leur formulaires.
>
> Une fois le formulaire validé, j'affiche une DIV en haut à droite du
> navigateur pour indiquer l'état du traitement. Cependant, la page peut être
> revalidée ou les champs modifiés.
>
> Je désactive donc les contrôles du formulaire via disabled. Cependant, je
> suis *fatigué* de devoir coder tout ça pour chaque page.
>
> Est-il possible d'écrire une fonction générique désactivant tous les INPUT
> (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle parcourt tous
> les contrôles de la page et les désactive...

function desactive(frm)
{
var i, E;
for ( i = frm.elements.length; i--; )
{
E = frm.elements[i];
// si l'élément a la classe "keepActive"
// alors ne rien faire
if ( /\bkeepActive\b/.test(E.className) ) { continue; }
E.oldDisabled = E.disabled || null;
E.disabled = true;
}
}

function active(frm)
{
var i, E;
for ( i = frm.elements.length; i--; )
{
E = frm.elements[i];
if ( /\bkeepActive\b/.test(E.className) ) { continue; }
E.disabled = E.oldDisabled;
}
}

<form>
<input type="button" onclick="desactive(this.form)" class="keepActive"
value="Deactivate">
<input type="button" onclick="active(this.form)" class="keepActive"
value="Activate">
<br>
<input type="text">
<input type="text" disabled="disabled">
<br>
<textarea></textarea>
<textarea disabled="disabled"></textarea>
<br>
<input type="checkbox" name="y" value="1">
<input type="checkbox" name="y" value="2" disabled="disabled">
<br>
<input type="radio" name="x" value="1">
<input type="radio" name="x" value="2" disabled="disabled">
<br>
<select><option>0</option></select>
<select disabled="disabled"><option>1</option></select>
</form>

> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi les
> liens ?

Dans ce cas autant mettre un gros div qui intercepte les clicks par
dessus tout le monde plutot que de s'embêter avec chaque élément. Parce
que après les liens, ca va être les éléments avec un event mouseover,
click ou autre qu'il va falloir tracker. Trop fatiguant imo.

function divAntiClick()
{
var
div = document.createElement('div'),
dS = div.style,
dB = document.body;
// interdit les clicks
div.onclick = function() { return false; };
dS.opacity = 0.25;
// opacité pour IE
/*@cc_on dS.filter = 'alpha(opacity=25)'; @*/
dS.backgroundColor = 'black';
dS.position = 'absolute';
dS.top = '0px';
dS.left = '0px';
dS.width = '100%';
dS.zIndex = 1e6;
// enregistre l'état d'overflow avant modif
dB.oldOverflow = dB.style.overflow;
// supprime l'overflow pour empêcher le user
// de servir des scrollbars. Ne pas oublier
// lors de la réactivation de replacer l'overflow
// à sa valeur initiale stockée dans oldOverflow
dB.style.overflow = 'hidden';
// détermine la hauteur du div, cf fonction suivante
dS.height = getViewportHeight() + 'px';
// ajoute enfin le div
dB.appendChild(div);
}

/**
* Returns the current height of the viewport.
* @return {Int} The height of the viewable area
* of the page (excludes scrollbars).
*/
function getViewportHeight()
{
var
IE = /*@cc_on !@*/false,
height = -1;

// IE, Gecko
if ( ( document.compatMode || IE ) && !window.opera )
{
// Standards mode
if ( document.compatMode === 'CSS1Compat' )
{
height = document.documentElement.clientHeight;
}
// Quirks
else { height = document.body.clientHeight; }
}
// Safari, Opera
else { height = self.innerHeight; }

return height;
}

--
laurent

Laurent vilday a utilisé son clavier pour écrire :

> Dans ce cas autant mettre un gros div qui intercepte les clicks par dessus
> tout le monde plutot que de s'embêter avec chaque élément. Parce que après
> les liens, ca va être les éléments avec un event mouseover, click ou autre
> qu'il va falloir tracker. Trop fatiguant imo.

Merci de ton aide, je vais voir ce que donne ces functions.

--
Delf

Laurent vilday a utilisé son clavier pour écrire :

> Dans ce cas autant mettre un gros div qui intercepte les clicks par dessus
> tout le monde plutot que de s'embêter avec chaque élément. Parce que après
> les liens, ca va être les éléments avec un event mouseover, click ou autre
> qu'il va falloir tracker. Trop fatiguant imo.

Merci de ton aide, je vais voir ce que donne ces functions.

--
Delf

Laurent vilday a écrit :

> dB.style.overflow = 'hidden';

J'ai écris : document.body.style.overflow = 'hidden';

Ca fonctionne sous Firefox mais pas sous IE7 :|
Une idée ? Pourtant ça devrait, je trouve rien sur le Net...

Merci.

--
Delf

Laurent vilday a écrit :

> dB.style.overflow = 'hidden';

J'ai écris : document.body.style.overflow = 'hidden';

Ca fonctionne sous Firefox mais pas sous IE7 :|
Une idée ? Pourtant ça devrait, je trouve rien sur le Net...

Merci.

--
Delf

Il se trouve que Delf a formulé :

> Ca fonctionne sous Firefox mais pas sous IE7 :|
> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...

Si je retire la balise DOCTYPE, c'est bon...

--
Delf

Il se trouve que Delf a formulé :

> Ca fonctionne sous Firefox mais pas sous IE7 :|
> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...

Si je retire la balise DOCTYPE, c'est bon...

--
Delf

Delf avait énoncé :
> Il se trouve que Delf a formulé :
>
>> Ca fonctionne sous Firefox mais pas sous IE7 :|
>> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...
>
> Si je retire la balise DOCTYPE, c'est bon...

j'ai rajouté ceci :

<style ...>
html
{
overflow:hidden;
}
</style>

et apparemment, ça fonctionne. Je ne risque pas d'avoir de soucis avec
d'autres browsers ?

Merci.

--
Delf

Delf avait énoncé :
> Il se trouve que Delf a formulé :
>
>> Ca fonctionne sous Firefox mais pas sous IE7 :|
>> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...
>
> Si je retire la balise DOCTYPE, c'est bon...

j'ai rajouté ceci :

<style ...>
html
{
overflow:hidden;
}
</style>

et apparemment, ça fonctionne. Je ne risque pas d'avoir de soucis avec
d'autres browsers ?

Merci.

--
Delf

Delf avait prétendu :

> j'ai rajouté ceci :
>
> [...]

Et j'ai gardé la balise DOCTYPE.

--
Delf

Delf avait prétendu :

> j'ai rajouté ceci :
>
> [...]

Et j'ai gardé la balise DOCTYPE.

--
Delf

En réponse à Delf qui écrivit, en date du : 17/08/07 18:33, le message
suivant :
> Delf a couché sur son écran :
>
>> Est-il possible d'écrire une fonction générique désactivant tous les
>> INPUT (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle
>> parcourt tous les contrôles de la page et les désactive...
>
> Problème, si j'ai déjà des contrôles désactivés, je les perds lors de la
> réactivation...

Ben ! suffit de les re-désactiver dans la foulée, non ?

> Autre question : comment mettre un voile transparent sur l'ensemble de
> la page ?

<script type="text/javascript">
function voile() {
if(document.getElementById) {
if(document.getElementById('voile')) {
var voil = document.getElementById('voile').style;
voil.display = voil.display=='block'? 'none' : 'block';
}
else {
var voil = document.createElement('DIV');
voil.id = 'voile';
voil.style.display = 'block';
voil.style.position = 'absolute';
voil.style.top = '0px';
voil.style.left = '0px';
voil.style.width = '100%';
voil.style.height = '100%';
voil.style.backgroundColor = '#555';
voil.style.opacity = '0.4';
voil.style.khtmlOpacity = '0.4';
voil.style.mozOpacity = '0.4';
voil.style.filter = 'alpha(opacity=40)';
voil.onclick = voile;
document.body.appendChild(voil);
}
}
}
</script>

<a href="javascript:voile()">voile oui/non</a>

En réponse à Delf qui écrivit, en date du : 17/08/07 18:33, le message
suivant :
> Delf a couché sur son écran :
>
>> Est-il possible d'écrire une fonction générique désactivant tous les
>> INPUT (textbox, textarea, radiobutton, checkbox, etc) ? Genre, elle
>> parcourt tous les contrôles de la page et les désactive...
>
> Problème, si j'ai déjà des contrôles désactivés, je les perds lors de la
> réactivation...

Ben ! suffit de les re-désactiver dans la foulée, non ?

> Autre question : comment mettre un voile transparent sur l'ensemble de
> la page ?

<script type="text/javascript">
function voile() {
if(document.getElementById) {
if(document.getElementById('voile')) {
var voil = document.getElementById('voile').style;
voil.display = voil.display=='block'? 'none' : 'block';
}
else {
var voil = document.createElement('DIV');
voil.id = 'voile';
voil.style.display = 'block';
voil.style.position = 'absolute';
voil.style.top = '0px';
voil.style.left = '0px';
voil.style.width = '100%';
voil.style.height = '100%';
voil.style.backgroundColor = '#555';
voil.style.opacity = '0.4';
voil.style.khtmlOpacity = '0.4';
voil.style.mozOpacity = '0.4';
voil.style.filter = 'alpha(opacity=40)';
voil.onclick = voile;
document.body.appendChild(voil);
}
}
}
</script>

<a href="javascript:voile()">voile oui/non</a>

En réponse à Laurent vilday qui écrivit, en date du : 17/08/07 21:02,
le message suivant :
> Delf a écrit :
>
>> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi
>> les liens ?
>
> Dans ce cas autant mettre un gros div qui intercepte les clicks par
> dessus tout le monde plutot que de s'embêter avec chaque élément. Parce
> que après les liens, ca va être les éléments avec un event mouseover,
> click ou autre qu'il va falloir tracker. Trop fatiguant imo.
>
> function divAntiClick()
> {
> var
> div = document.createElement('div'),
> dS = div.style,
> dB = document.body;
> // interdit les clicks
> div.onclick = function() { return false; };

Oui, pas bête ... mais ... et comment revient-on à la "normale" ?

> dS.opacity = 0.25;
> // opacité pour IE
> /*@cc_on dS.filter = 'alpha(opacity=25)'; @*/
> dS.backgroundColor = 'black';
> dS.position = 'absolute';
> dS.top = '0px';
> dS.left = '0px';
> dS.width = '100%';
> dS.zIndex = 1e6;

Pourquoi un z-index ?
(dans la mesure où on insère ce div qu'en fin de body, en fin du flux)

> // enregistre l'état d'overflow avant modif
> dB.oldOverflow = dB.style.overflow;
> // supprime l'overflow pour empêcher le user
> // de servir des scrollbars. Ne pas oublier
> // lors de la réactivation de replacer l'overflow
> // à sa valeur initiale stockée dans oldOverflow
> dB.style.overflow = 'hidden';

dB.style.overflow = dB.style.overflow==''? 'hidden' : '';

> // détermine la hauteur du div, cf fonction suivante

et pourquoi ?
dS.height = '100%';
ne suffit-il pas ?
Tiens ? ça n'a lair de fonctionner qu'avec FF !

> dS.height = getViewportHeight() + 'px';

ça ne mesure finalement que le l'aire de vue ... pas le document.

> // ajoute enfin le div
> dB.appendChild(div);
> }
>
> /**
> * Returns the current height of the viewport.
> * @return {Int} The height of the viewable area
> * of the page (excludes scrollbars).
> */
> function getViewportHeight()

finalement, c'est ce getViewportHeight qui ne fonctionne pas chez moi
(avec mon test)
Safari 2.02
Opera 9.0
à moins que ce ne soit le body overflow qui n'y fasse pas grand' chose ?
(la molette continue de scroller, et de ttes façons le dS ne remplit que
le 1er écran alors que le bouton actionnant le divAntiClick est au 3ième
écran).

> {
> var
> IE = /*@cc_on !@*/false,
> height = -1;
>
> // IE, Gecko
> if ( ( document.compatMode || IE ) && !window.opera )
> {
> // Standards mode
> if ( document.compatMode === 'CSS1Compat' )
> {
> height = document.documentElement.clientHeight;
> }
> // Quirks
> else { height = document.body.clientHeight; }
> }
> // Safari, Opera
> else { height = self.innerHeight; }
>
> return height;
> }
>

En réponse à Laurent vilday qui écrivit, en date du : 17/08/07 21:02,
le message suivant :
> Delf a écrit :
>
>> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi
>> les liens ?
>
> Dans ce cas autant mettre un gros div qui intercepte les clicks par
> dessus tout le monde plutot que de s'embêter avec chaque élément. Parce
> que après les liens, ca va être les éléments avec un event mouseover,
> click ou autre qu'il va falloir tracker. Trop fatiguant imo.
>
> function divAntiClick()
> {
> var
> div = document.createElement('div'),
> dS = div.style,
> dB = document.body;
> // interdit les clicks
> div.onclick = function() { return false; };

Oui, pas bête ... mais ... et comment revient-on à la "normale" ?

> dS.opacity = 0.25;
> // opacité pour IE
> /*@cc_on dS.filter = 'alpha(opacity=25)'; @*/
> dS.backgroundColor = 'black';
> dS.position = 'absolute';
> dS.top = '0px';
> dS.left = '0px';
> dS.width = '100%';
> dS.zIndex = 1e6;

Pourquoi un z-index ?
(dans la mesure où on insère ce div qu'en fin de body, en fin du flux)

> // enregistre l'état d'overflow avant modif
> dB.oldOverflow = dB.style.overflow;
> // supprime l'overflow pour empêcher le user
> // de servir des scrollbars. Ne pas oublier
> // lors de la réactivation de replacer l'overflow
> // à sa valeur initiale stockée dans oldOverflow
> dB.style.overflow = 'hidden';

dB.style.overflow = dB.style.overflow==''? 'hidden' : '';

> // détermine la hauteur du div, cf fonction suivante

et pourquoi ?
dS.height = '100%';
ne suffit-il pas ?
Tiens ? ça n'a lair de fonctionner qu'avec FF !

> dS.height = getViewportHeight() + 'px';

ça ne mesure finalement que le l'aire de vue ... pas le document.

> // ajoute enfin le div
> dB.appendChild(div);
> }
>
> /**
> * Returns the current height of the viewport.
> * @return {Int} The height of the viewable area
> * of the page (excludes scrollbars).
> */
> function getViewportHeight()

finalement, c'est ce getViewportHeight qui ne fonctionne pas chez moi
(avec mon test)
Safari 2.02
Opera 9.0
à moins que ce ne soit le body overflow qui n'y fasse pas grand' chose ?
(la molette continue de scroller, et de ttes façons le dS ne remplit que
le 1er écran alors que le bouton actionnant le divAntiClick est au 3ième
écran).

> {
> var
> IE = /*@cc_on !@*/false,
> height = -1;
>
> // IE, Gecko
> if ( ( document.compatMode || IE ) && !window.opera )
> {
> // Standards mode
> if ( document.compatMode === 'CSS1Compat' )
> {
> height = document.documentElement.clientHeight;
> }
> // Quirks
> else { height = document.body.clientHeight; }
> }
> // Safari, Opera
> else { height = self.innerHeight; }
>
> return height;
> }
>

En réponse à Delf qui écrivit, en date du : 17/08/07 22:19, le message
suivant :
> Delf avait énoncé :
>> Il se trouve que Delf a formulé :
>>
>>> Ca fonctionne sous Firefox mais pas sous IE7 :|
>>> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...
>>
>> Si je retire la balise DOCTYPE, c'est bon...
>
> j'ai rajouté ceci :
>
> <style ...>
> html
> {
> overflow:hidden;
> }
> </style>
>
> et apparemment, ça fonctionne. Je ne risque pas d'avoir de soucis avec
> d'autres browsers ?

Ce truc bloque mon Firefox sur le 1er écran et je n'ai plus de scroll.
Ce truc supprime les ascenseurs de mon Safari et de mon Opera mais
n'empêche pas de croller (à la molette).

Si c'est OK pour IE, il faut donc le réserver à IE :

<!--[if lte IE 6]>
<style type="text/css">
html { overflow: hidden; }
</style>
<![endif]-->

Mais je ne vois pas comment tu peux être certain qu'une seule hauteur de
fenêtre (ou d'aire de vue ou de view port) suffise à afficher ta page
.... ? !

à moins qu'elle ne fasse qu'une ligne ?

--
Stéphane

En réponse à Delf qui écrivit, en date du : 17/08/07 22:19, le message
suivant :
> Delf avait énoncé :
>> Il se trouve que Delf a formulé :
>>
>>> Ca fonctionne sous Firefox mais pas sous IE7 :|
>>> Une idée ? Pourtant ça devrait, je trouve rien sur le Net...
>>
>> Si je retire la balise DOCTYPE, c'est bon...
>
> j'ai rajouté ceci :
>
> <style ...>
> html
> {
> overflow:hidden;
> }
> </style>
>
> et apparemment, ça fonctionne. Je ne risque pas d'avoir de soucis avec
> d'autres browsers ?

Ce truc bloque mon Firefox sur le 1er écran et je n'ai plus de scroll.
Ce truc supprime les ascenseurs de mon Safari et de mon Opera mais
n'empêche pas de croller (à la molette).

Si c'est OK pour IE, il faut donc le réserver à IE :

<!--[if lte IE 6]>
<style type="text/css">
html { overflow: hidden; }
</style>
<![endif]-->

Mais je ne vois pas comment tu peux être certain qu'une seule hauteur de
fenêtre (ou d'aire de vue ou de view port) suffise à afficher ta page
.... ? !

à moins qu'elle ne fasse qu'une ligne ?

--
Stéphane

ASM a écrit :
> En réponse à Laurent vilday qui écrivit, en date du : 17/08/07 21:02,
> le message suivant :
>> Delf a écrit :
>>
>>> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi
>>> les liens ?
>>
>> Dans ce cas autant mettre un gros div qui intercepte les clicks par
>> dessus tout le monde plutot que de s'embêter avec chaque élément.
>>
>> function divAntiClick()
>> {
>> var
>> div = document.createElement('div'),
>> dS = div.style,
>> dB = document.body;
>> // interdit les clicks
>> div.onclick = function() { return false; };
>
> Oui, pas bête ... mais ... et comment revient-on à la "normale" ?

Bahh bahh, stéphane, voyons

var gestionnaire = function()
{
var active = null;
return {
show:function()
{
active = document.createElement('div');
....
document.body.appendChild(active);
},
hide:function{}
{
document.body.removeChild(active);
active = null;
}
};
}();

>> dS.zIndex = 1e6;
>
> Pourquoi un z-index ?
> (dans la mesure où on insère ce div qu'en fin de body, en fin du flux)

Tout simplement parce bien qu'il soit ajouté en fin de body, rien
n'indique que d'autres éléments en absolute avec un z-index n'existent
déjà sur la page. Alors dans le doute ....

>> // enregistre l'état d'overflow avant modif
>> dB.oldOverflow = dB.style.overflow;
>> // supprime l'overflow pour empêcher le user
>> // de servir des scrollbars. Ne pas oublier
>> // lors de la réactivation de replacer l'overflow
>> // à sa valeur initiale stockée dans oldOverflow
>> dB.style.overflow = 'hidden';
>
> dB.style.overflow = dB.style.overflow==''? 'hidden' : '';

Ben non malheureusement. Quid des 'auto', 'visible' et autre 'scroll' de
la propriété ?

>> // détermine la hauteur du div, cf fonction suivante
>
> et pourquoi ?
> dS.height = '100%';
> ne suffit-il pas ?
> Tiens ? ça n'a lair de fonctionner qu'avec FF !

Parce que je suis idiot et que j'ai rien testé. C'est l'idée que j'ai
suivi, j'avais un bout de code qui me semblait approprié et qui trainait
- inutilisé, peut être à raison - dans son coin, alors hop puisque
ça semblait collé et que j'avais pris le temps de commencer le post...
Mea culpa, j'aurais du tester.

>> dS.height = getViewportHeight() + 'px';
>
> ça ne mesure finalement que le l'aire de vue ... pas le document.

Vi, d'ou "l'astuce" (hurmm de changer le body.style.overflow

>> // ajoute enfin le div
>> dB.appendChild(div);
>> }
>>
>> /**
>> * Returns the current height of the viewport.
>> * @return {Int} The height of the viewable area
>> * of the page (excludes scrollbars).
>> */
>> function getViewportHeight()
>
> finalement, c'est ce getViewportHeight qui ne fonctionne pas chez moi
> (avec mon test)
> Safari 2.02
> Opera 9.0

Après test, ca passe pour IE7, FX2, Opera 9.22 et Safari (win) 3.0.2
beta. Je sais que tu le fais exprès rien que pour m'embêter

> à moins que ce ne soit le body overflow qui n'y fasse pas grand' chose ?
> (la molette continue de scroller, et de ttes façons le dS ne remplit que
> le 1er écran alors que le bouton actionnant le divAntiClick est au 3ième
> écran).

Satanée molette. Pourtant depuis le temps je devrais le savoir qu'il
faut tester... Bon tant pis, pas trop le temps pour plus. Pour l'OP,
peut être oublier l'idée du gros <div>

--
laurent

ASM a écrit :
> En réponse à Laurent vilday qui écrivit, en date du : 17/08/07 21:02,
> le message suivant :
>> Delf a écrit :
>>
>>> Autre question : pensez-vous qu'il soit judicieux de désactiver aussi
>>> les liens ?
>>
>> Dans ce cas autant mettre un gros div qui intercepte les clicks par
>> dessus tout le monde plutot que de s'embêter avec chaque élément.
>>
>> function divAntiClick()
>> {
>> var
>> div = document.createElement('div'),
>> dS = div.style,
>> dB = document.body;
>> // interdit les clicks
>> div.onclick = function() { return false; };
>
> Oui, pas bête ... mais ... et comment revient-on à la "normale" ?

Bahh bahh, stéphane, voyons

var gestionnaire = function()
{
var active = null;
return {
show:function()
{
active = document.createElement('div');
....
document.body.appendChild(active);
},
hide:function{}
{
document.body.removeChild(active);
active = null;
}
};
}();

>> dS.zIndex = 1e6;
>
> Pourquoi un z-index ?
> (dans la mesure où on insère ce div qu'en fin de body, en fin du flux)

Tout simplement parce bien qu'il soit ajouté en fin de body, rien
n'indique que d'autres éléments en absolute avec un z-index n'existent
déjà sur la page. Alors dans le doute ....

>> // enregistre l'état d'overflow avant modif
>> dB.oldOverflow = dB.style.overflow;
>> // supprime l'overflow pour empêcher le user
>> // de servir des scrollbars. Ne pas oublier
>> // lors de la réactivation de replacer l'overflow
>> // à sa valeur initiale stockée dans oldOverflow
>> dB.style.overflow = 'hidden';
>
> dB.style.overflow = dB.style.overflow==''? 'hidden' : '';

Ben non malheureusement. Quid des 'auto', 'visible' et autre 'scroll' de
la propriété ?

>> // détermine la hauteur du div, cf fonction suivante
>
> et pourquoi ?
> dS.height = '100%';
> ne suffit-il pas ?
> Tiens ? ça n'a lair de fonctionner qu'avec FF !

Parce que je suis idiot et que j'ai rien testé. C'est l'idée que j'ai
suivi, j'avais un bout de code qui me semblait approprié et qui trainait
- inutilisé, peut être à raison - dans son coin, alors hop puisque
ça semblait collé et que j'avais pris le temps de commencer le post...
Mea culpa, j'aurais du tester.

>> dS.height = getViewportHeight() + 'px';
>
> ça ne mesure finalement que le l'aire de vue ... pas le document.

Vi, d'ou "l'astuce" (hurmm de changer le body.style.overflow

>> // ajoute enfin le div
>> dB.appendChild(div);
>> }
>>
>> /**
>> * Returns the current height of the viewport.
>> * @return {Int} The height of the viewable area
>> * of the page (excludes scrollbars).
>> */
>> function getViewportHeight()
>
> finalement, c'est ce getViewportHeight qui ne fonctionne pas chez moi
> (avec mon test)
> Safari 2.02
> Opera 9.0

Après test, ca passe pour IE7, FX2, Opera 9.22 et Safari (win) 3.0.2
beta. Je sais que tu le fais exprès rien que pour m'embêter