0

Помогите зделать hover в мега меню, при наведении на позицию появляется список и сразу пропадает, без возможности навести на него. Помогите это исправить на JQuery.

Вот что у меня получилось:

$('.mega-mnu ul li').hover(function () {
     var mega_inner  = $(this).find('ul');
     mega_inner.css({'display':'block'});
  },
  function () {
      var mega_inner  = $(this).find('ul');
      mega_inner.css({'display':'none'});
  }
);

http://codepen.io/jSas/pen/LbavKz

1
  • А зачем на jquery? hover можно прекрасно сделать на чистом CSS. 21 дек 2016 в 17:58

1 ответ 1

2

С функцией все нормально, надо чуть css поправить:

.mega-mnu{
      width: 75%;
      height: 565px;
      margin: 0 auto;
      background-color: #fff;
      display: block;
      padding: 70px 30px;
      text-transform: uppercase;
      position: relative;
      text-decoration: none;
        ul{
          width: 260px;
          position: relative;
          outline:2px solid green;
          li{
            margin-bottom: 30px;
            position: relative;
            outline:2px solid green;
            width: 100%;
            display: block;
              &:hover{
                &::before{
                  font-family: FontAwesome;
                  position: absolute;
                  top: -1px;
                  right: -25px;
                  font-size: 1.5em;

                }
              }
            a{
              color: #a5a5a5;

              &:hover{
                color: #000;

              }
            }
            ul{
              position: absolute;
              top: 0;
              right: -530px;
              left:250px;
              display: none;
              outline:2px solid red;
              li{
              }
            }
          }
        }
    }

view code

1
  • Спасибо огромное,сейчас буду править.
    – JavAs
    21 дек 2016 в 15:22

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.