title: mouseover on an img, but mouseout on a div
body: <p>I have a little problems with mouseover and mouseout</p>
  
  <p>I want to use mouseover when the user put his mouse in the image (id = calendrieragenda), but mouseout only when he leave the parent div (id = divagenda), but it's don't work, when the user leave his mouse from the image, it's activate the function mouseout</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var divagenda = document.getElementById('divagenda');
  var calendrieragenda = document.getElementById('imageagenda');
  
  calendrieragenda.addEventListener('mouseover', function() {
    document.getElementById('divagenda').className = 'popUpAgendaMouseOver';
  });
  
  divagenda.addEventListener('mouseout', function() {
        document.getElementById('divagenda').className = 'popUpAgendaMouseOut';
  
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#divagenda {
    margin-top: 1em;
  }
  
  #imageagenda {
    width: 8%;
    position: relative;
    right: 6%;
    margin-top: 1em;
    margin-bottom: 1em;
    transition-duration: 0.5s;
    transform: translateX(-50%);
    left: 50%;
    z-index: 600;
  }
  
  .popUpAgendaMouseOver {
    border-radius : 1em;
    border : 1px rgba(250, 250, 250, .8) solid;
    background-color: #444444;
    transition: 1s;
  }
  
  .popUpAgendaMouseOut {
    border : none;
    background-color:none;
    transition: 1s;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="divagenda"&gt;
    &lt;a href="link" title="Lien vers l'Agenda" target="_blank"&gt;
      &lt;img id="imageagenda" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRSf_HZLgiKNGwWv6V9Urtv3P2Sfo_Liw2dwOnq_oXg6-WInr_s" /&gt;
    &lt;/a&gt;
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I do a jsfiddle to show you my code : <a href="https://jsfiddle.net/v7pkhymm/7/" rel="nofollow noreferrer">https://jsfiddle.net/v7pkhymm/7/</a></p>
  
  <p>Thank you very much and have a nice day !</p>