blog actif depuis 1431 jours.

retours d'expériences, codes sources, réflexions, humeurs... d'un webmaster

Lun.

Déc.

Vérifier si javascript est activé à l'aide de ... jQuery

Voici une méthode pour détecter et notifier si javascript est activé, à l'aide de jQuery.
Le principe est simple : on affiche un div par défaut avec du CSS avec le message "javascript n'est pas activé" et un autre désactivé par défaut avec le message "javascript est activé" et on inverse l'affichage avec jQuery.
S'il est actif, le premier div disparait et le deuxième apparait, sinon rien ne se passe.

Dans le <head>, on met le code javascript :

<script language="javascript">
    $(document).ready(function()
    { 
        $('#javascriptKo').hide();
        $('#javascriptOk').show();
    });
</script>

Dans le <body>, les divs :

<div id="javascriptKo" style="display:block: font-weight:bold; color:#ff0000; font-size:15px;">
    ATTENTION : le Javascript n'est pas activé sur votre navigateur.
</div>
<div id="javascriptOk" style="display:none">
    javascript est activé
</div>

Commentaires

Bonjour, bonne idée, j'hésitais à employer la balise noscript pour des images qui se chargent en ajax, mais d'après ce que j'ai lu il y avait peu de chances pour que google indexe mes images entre les balises . Penses tu qu'avec ta méthode, google va référencer mes images ?

11/02/2011

@olivier : bonjour. Oui, les images chargées en Ajax ne sont pas vues par Google, mais la balise noscript sera bien lue par les robots.

12/02/2011

ce n'était pas ma question... j'avais l'idée de remplacer mes balises noscript par des <div id="javascriptKo">. Car après un petit tour sur Google image je me suis rendu compte que les images dans des balises noscript sont très mal référencées

13/02/2011

quelle différence entre $('#javascriptKo').hide();
et
$('#javascriptKo').remove();

13/02/2011

@olivier: effectivement, si le noscript est mal référencé, l'insertion des images dans un div devrait être plus efficace. C'est une bonne idée.
Sinon pour le jQuery, hide() met à jour le style du div en mettant display à none, remove() quant-à lui supprime l'élément de la DOM.

13/02/2011

Ajouter un commentaire

romualb.com est sur Facebook

Petitchevalroux - les notes d'un dev php mysql
CERDAN Yohann - Blog d'un développeur PHP/TYPO3 http://www.ycerdan.fr/
LyRiXx Blog
Développeur Web à Grenoble