Javascript 滚动通知菜单（jQuery）

我尝试为我的通知div创建一个垂直滚动div，它是一个不显示的div，直到使用HTML和CSS按下通知图标，它失败了，在chrome浏览器中，至少浏览器向我显示滚动条，但我无法控制它，无法滑动该矩形，当我单击箭头时，什么也没有发生，我尝试了overflow-y和scrolling-property，但什么都不起作用，仅供参考。我有4个通知框，它们相互重叠，只有在单击正确的图标时才会显示一个用于通知，一个用于消息，另一个用于友谊请求，最后一个用于论坛通知HTML如下：

<div id="infoNot" >
  <ul>
      <a href=''><li>Foulan a accépter votre demande d'amitié</li></a>
      <a href=''><li>Foulan a poster dans le forum</li></a>
      <a href=''><li>Foulan a bla bla bla</li></a>
      <a href=''><li>Foulan a accépter votre demande d'amitié</li></a>
      <a href=''><li>Foulan a poster dans le forum</li></a>
      <a href=''><li>Foulan a bla bla bla</li></a>
      <a href=''><li>Foulan a accépter votre demande d'amitié</li></a>
      <a href=''><li>Foulan a poster dans le forum</li></a>
      <a href=''><li>Foulan a bla bla bla</li></a>
      <a href=''><li>Foulan a accépter votre demande d'amitié</li></a>
      <a href=''><li>Foulan a poster dans le forum</li></a>
      <a href=''><li>Foulan a bla bla bla</li></a>
      <a href=''><li>Foulan a accépter votre demande d'amitié</li></a>
      <a href=''><li>Foulan a poster dans le forum</li></a>
      <a href=''><li>Foulan a bla bla bla</li></a>
      <a href='' class="cMore">
      <li class="cMore">Voir toutes les notifications</li></a>
  </ul>
</div>
<div id="infoMsg">
  <ul>
      <li><img src='media/images/icons/msg.png'><p class="sender">YOLO</p>
      <p class="description">Salut, Cava? wi non pas bien</p><span></span></li>
      <li><img src='media/images/icons/msg.png'><p>Salut</p><span></span></li>
      <li><img src='media/images/icons/msg.png'><p>Salut</p><span></span></li>
  </ul>
</div>
<div id="infoForum">
  <ul>
      <a href=''><li>Foulan a repondu à votre poste dans le forum</li></a>
      <a href=''><li>L'admin a supprimer votre sujet</li></a>
      <a href=''><li>bla bla bla</li></a>
  </ul>
</div>
<div id="infoFR">
   <ul>
     <a href=''><li>Foulan foulani veut étre votre ami</li></a>
     <a href=''><li>Fataan foulani veut étre votre ami</li></a>
     <a href=''><li>Mr. X foulani veut étre votre ami</li></a>
   </ul>
</div>

---

作为参考，将元素作为ul元素的子元素在语义上是不正确的。您当前的设置具有包含li的ul。您将希望将这些锚定标记放在列表项标记中。谢谢，但是，我已经更改了它，这没有帮助

#infoNot , #infoMsg , #infoForum , #infoFR
{
    top:50px;
    left:10px;
    display: block;
    position: absolute;
    margin-top: 5px;
    visibility: hidden;
    height: 100%;
}
#infoMsg
{
    left:25px;
    height: 500px;
}
#infoNot ul , #infoMsg ul , #infoForum ul , #infoFR ul
{
    list-style: none;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
    background-color: white;
    border: 1px black solid;
    border-radius: 5px 5px 5px 5px;
}
#infoNot ul a
{
    display: block;
    width: 100%;
    height:100%;
}
#infoNot ul a:nth-child(even)
{
    color: #595959;
    background-color: #a1a1a1;
}
#infoNot ul a:nth-child(odd)
{
    color: #a1a1a1;
    background-color: #595959;
}
#infoNot ul a:hover
{
    background-color: #818181;
}
#infoMsg ul li img
{
    float:left;
    display: block;
}
#infoMsg ul li
{
    padding-top:3px;
    padding-buttom:3px;
    border-bottom: 1px solid #c4c4c2;
}
#infoMsg span
{
    clear:both;
    display: block;
}