title: Animate image on click HTML
body: <p><br> Is there a way in which a person clicks on the text <code>Hello</code> and it slides down an dims out?? and on phone they should be able to just pull it down and it gets dimed and slides down??</p>
  <p>Summarizing the question
  <br>1: Click on text to make the dive slide down and dim out??<br> 2: For <code>Mobile</code> pull the div out of the screen and dim it out by hand??</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-css lang-css prettyprint-override"><code>#home_main_main {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    border: 3px solid darkgrey;
    width: calc(100% - 6px);
    height: 80%;
    left: 0px;
    position: absolute;
    position: fixed;
    left: 0;
    bottom: 0;
  }
  
  b {
    font-size: 20px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="home_main_main"&gt;&lt;br&gt;
      &lt;b&gt;&amp;nbsp;Hello&lt;/b&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>