Valery

У вас меню выпадает при наведении на #nav li, верно?
При #nav li:hover этот пункт меняет цвет и выпадает меню, которое находится в этом li?
Задача должна решаться простым
#nav li:hover > a { background: #f5f5f5; }

Ставите VMware. Берете образ Mac OS, например этот. Затем на готовой виртуальной машине ставите Xcode, где и будут доступны эмуляторы всех Apple-устройств, начиная с планшетов и заканчивая часами

Либо обернуть текст в какой-нибудь <span> со свойством display: inline-block, либо по-грязному прописать display: table для <li>

Попробуйте добавлять pointer-events: auto после того, как анимация закончится

<script>
	window.onload = function(){
		document.getElementById('test').style.webkitTransform = "translate3d(0px, 250px, 0px)";

		setTimeout(function(){
			document.getElementById('test').style.pointerEvents = "auto";
		},400)
	}
</script>

Зачем усложнять себе жизнь? Прикрутите какой-нибудь wow.js

Конкретно в данном случае достаточно будет
margin-top: -420px для .b12

Но вообще для таких целей лучше использовать Masonry

Flex
Абсолютное позиционирование
upd: еще вот такое извращение
Если зеленые блоки не будут иметь фиксированную высоту, то остается использовать flex

Поведение и правда интересное. Интересно и то, что при сохранении странички на компьютер проблема пропадает. Так же, как пропадает обертка

< div class="designmodo-wrapper home page page-id-1483 page-parent page-template-default" />

У которой прописано transform: translate3d(0, 0, 0). Что и заставляет фиксированное меню вести себя так, словно оно спозиционированно относительно этого родителя, а не вьюпорта. Вот пример на codepen для наглядности: codepen.io/markdebeer/pen/qrBDm
Но если убрать transform: translate3d на сайте через инспектор, проблема остается (в отличие от примера на codepen). Не знаю, куда копать дальше

Показывайте и скрывайте меню через присвоение отдельного класса, например:

burger.on('click', function(){
    menu.toggleClass('visible')
})

И все будет гибко контролироваться через css

Swiper

Сделать обертку для второго дива с overflow: hidden не вариант?
codepen.io/anon/pen/yNpjgW

В вашем примере оно прыгает из-за того, что у body есть margin. Обнулите:

body {
    margin: 0;
}