Mise en valeur d'un div en masquant le reste

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par Lindy, 13 Février 2013.

  1. Lindy
    Lindy WRInaute discret
    Inscrit:
    7 Mars 2012
    Messages:
    83
    J'aime reçus:
    0
    Hello,

    Je souhaiterais que lorsque mes visiteurs cliquent sur un bouton, un div contenant du texte important soit mis en valeur, afin d'être sûrs qu'il soit lu. Pour ce faire, je voudrais pouvoir appliquer une sorte de calque gris opaque à 50% sur tout l'écran, sauf sur le div en question qui resterait blanc. Dans ce div serait présente une case qui lorsqu'elle serait cochée enlèverait ce calque.

    Je ne sais pas trop comment faire ... à part peut-être insérer en JS des div gris en haut, en bas, à gauche et à droite du div important, avec une opacité à 50% et un z-index élevé. Mais ça me semble très brouillon. Peut-être qu'il existe déjà un script qui fait ça ? Vous avez une idée ?

    Merci beaucoup.
     
  2. Supermaury
    Supermaury WRInaute discret
    Inscrit:
    25 Mars 2009
    Messages:
    144
    J'aime reçus:
    5
  3. Lindy
    Lindy WRInaute discret
    Inscrit:
    7 Mars 2012
    Messages:
    83
    J'aime reçus:
    0
    En fait, je crois que je suis arrivé au résultat que je voulais à la main.

    J'ai créé un div en JS de la taille du document avec de l'opacité, et ensuite j'ai pris le div que je voulais mettre en valeur et je lui ai mis un z-index supérieur pour qu'il passe par dessus. Cliquer sur la case à cocher supprime le div et remet le z-index original.

    Quelques soucis avec la compatibilité IE mais je devrais m'en sortir :)

    Merci en tout cas.
     
Chargement...
Similar Threads - valeur div masquant Forum Date
Comparer un array avec plusieurs valeurs Développement d'un site Web ou d'une appli mobile 19 Novembre 2021
Récupérer les 10 plus grandes valeurs dans un fichier JSON Développement d'un site Web ou d'une appli mobile 18 Novembre 2021
Valeur des conversions Google Ads + élevé que Google Analytics AdWords 2 Juin 2021
Comment rédiger un article à forte valeur ajoutée pour un client ? Rédaction web et référencement 19 Décembre 2020
Astuce Un bon outil pour connaître la valeur de mon trafic organique ? Le café de WebRankInfo 1 Juin 2020
Connaître la valeur d'un site (Backlinks, prix du site etc. ) Débuter en référencement 30 Mars 2020
Valeur nom de domaine Noms de domaine et référencement 9 Décembre 2019
Outils pour estimer la valeur d'un site Débuter en référencement 28 Mars 2019
Afficher des valeurs d'une colonne à l'autre selon condition Développement d'un site Web ou d'une appli mobile 11 Février 2019
Adsense: Inventaire de valeur : Aucun contenu AdSense 25 Janvier 2019
Mise en valeur des méta déscritpion Débuter en référencement 11 Octobre 2018
Deplacer une valeur d'un champs a un autre Développement d'un site Web ou d'une appli mobile 8 Octobre 2018
Limiter un nombre à une valeur max dans SQL Administration d'un site Web 29 Mars 2018
Afficher valeur id onclick sur checkbox Développement d'un site Web ou d'une appli mobile 21 Février 2018
Comment interdire le crawl des pages de faibles valeurs (Noindex ; Nofollow ; Disallow ?) Débuter en référencement 22 Mars 2017
Variable personnalisées : grouper par intervalle de valeur dans un dashboard Google Analytics 4 Janvier 2017
afficher une valeur maximale dans une table Développement d'un site Web ou d'une appli mobile 10 Novembre 2016
[résolu] Récupérer des valeurs issues de javascript pour les mettre en base MySQL Développement d'un site Web ou d'une appli mobile 18 Juillet 2016
Quelle est la valeur ajoutée de Facebook ? Facebook 30 Décembre 2015
La meilleure solution pour vendre du contenu à forte valeur ajoutée ? Débuter en référencement 6 Juin 2015