[Белый шум]

Проверьте на разных браузерах и устройствах - не уверен, что способ универсальный.

<ul class="wrap middleMenu">
    <li class="menu__list first">
    <a class="touch">Каталог</a>
        <ul class="middleMenu__drop" style="display:none;">
            <li><a href="#">Туфли</a></li>
            <li><a href="#">Босоножки</a></li>
            <li><a href="#">Кеды</a></li>
            <li><a href="#">Кросcовки</a></li>
        </ul>
    </li>
    <li><a href="#">ОПЛАТА / ДОСТАВКА</a></li>
    <li><a href="#">ОТЗЫВЫ О МАГАЗИНЕ</a></li>
    <li class="last"><a href="#">НОВИНКИ</a></li>
</ul>

<script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
    $('.menu__list').on('mouseleave mouseenter click', function (e) {
if( e.relatedTarget === null && e.type !== 'click' ) return;
$('.middleMenu__drop').slideToggle(50);
    });
</script>