Partage
  • Partager sur Facebook
  • Partager sur Twitter

CSS - curseur qui ignore un overlay: comment faire

Sujet résolu
    25 octobre 2023 à 14:06:13

    Bonjour,

    Je travaille sur mon portfolio, j'ai choisi un design simple et dans des tons obscurs. J'ai donc mis un degradé: (0,0,0,0) vers noir en haut et en bas.

    Mes projets sont dans des cartes en dessous de ces 'overlays', et le problème c'est qu'elles sont cliquable entre les deux overlays, mais pas sur les overlays (étant en z-index: 1), le navigateur estime que je suis en :hover sur les overlays et non les cartes. Ces overlays sont fait en utilisant la propriété linear-gradient de background-image.

    Est-ce qu'il y a un moyen de contourner ce problème en css?

    en rouge la seule zone clickable sur mes cartes:

    -
    Edité par AlexRz 25 octobre 2023 à 14:07:31

    • Partager sur Facebook
    • Partager sur Twitter
      25 octobre 2023 à 15:28:26

      Bonjour,

      Le message qui suit est une réponse automatique activée par un membre de l'équipe de modération. Les réponses automatiques leur permettent d'éviter d'avoir à répéter de nombreuses fois la même chose, ce qui leur fait gagner du temps et leur permet de s'occuper des sujets qui méritent plus d'attention.
      Nous sommes néanmoins ouverts et si vous avez une question ou une remarque, n'hésitez pas à contacter la personne en question par Message Privé.

      Pour plus d'informations, nous vous invitons à lire les règles générales du forum

      Merci de colorer votre code à l'aide du bouton Code

      Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Code de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue.

      Autre possibilité : nous donner l'url d'une page en ligne afin qu'on puisse expérimenter directement.

      Merci de modifier votre message d'origine en fonction.

      • Partager sur Facebook
      • Partager sur Twitter

      Pas d'aide concernant le code par MP, le forum est là pour ça :)

        25 octobre 2023 à 16:22:22

        Lamecarlate a écrit:

        Bonjour,

        Le message qui suit est une réponse automatique activée par un membre de l'équipe de modération. Les réponses automatiques leur permettent d'éviter d'avoir à répéter de nombreuses fois la même chose, ce qui leur fait gagner du temps et leur permet de s'occuper des sujets qui méritent plus d'attention.
        Nous sommes néanmoins ouverts et si vous avez une question ou une remarque, n'hésitez pas à contacter la personne en question par Message Privé.

        Pour plus d'informations, nous vous invitons à lire les règles générales du forum

        Merci de colorer votre code à l'aide du bouton Code

        Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Code de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue.

        Autre possibilité : nous donner l'url d'une page en ligne afin qu'on puisse expérimenter directement.

        Merci de modifier votre message d'origine en fonction.

        Bonjour, je n'ai pas mis de code parce que j'ai posé une question très précise qui à une incidence directe sur le visuel:
        Est-il possible oui ou non d'ignorer un élément grâce à je sais pas.. une propriété du curseur (comme cursor:pointer pour transformer le curseur en main) ou autre?

        Edit: J'ai utilisé ChatGpt et ce que je cherchais c'est 'pointer-events: none;' à appliquer sur l'élément que l'on souhaite ignorer pour indiquer que tel élément de la page est non interactif. 
        Bonne journée.

        -
        Edité par AlexRz 25 octobre 2023 à 16:33:21

        • Partager sur Facebook
        • Partager sur Twitter

        CSS - curseur qui ignore un overlay: comment faire

        × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
        × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
        • Editeur
        • Markdown