Установите div, чтобы исчезать при нажатии на href (может быть, jQuery?)

Question

Итак, вот проект, над которым я работаю для друга - http://projects.beauaugust.co.uk/cheatulous/

Что мне нужно сделать, так это то, что при щелчке по одной из ссылок в .menu элементы div внутри .items исчезают. У меня уже есть это, так что div .sort изменяет размеры для хранения содержимого, мне просто нужны эти элементы div для постепенно исчезают, так что кажется, что содержимое внутри, если это имеет смысл. Если вы нажмете на одну из ссылок внутри строки меню в демоверсии, вы увидите.

Ура, как всегда, если я не дал достаточно информации, извините!

Answer 1

$(function() {
    $(".item").hide();
    $(".menu a").click(function(event) {
        event.preventDefault(); //stops page from reloading on link click
        $(".item").fadeIn("slow");
    });
});

Что-то подобное?

Альтернатива:

Если вы хотите, чтобы элементы div исчезали после загрузки страницы (т. Е. Вы хотите фактически переключиться на другую html-страницу, а затем добавили div), вышеописанное не будет работать. Вместо этого вы можете просто добавить:

$(function() {
    $(".item").hide().fadeIn("slow");
});

Что заставит .item divs мигать (скрывать, а затем исчезать, что вам и нужно) после перезагрузки страницы.

Альтернатива 2:

Если вы хотите, чтобы пять отображаемых в данный момент div были скрыты при первом входе на страницу, а затем отображались при нажатии на ЛЮБУЮ ссылку (т.е. они будут отображаться, когда желтый фон смещается вниз), вы можете использовать display:none на .item в CSS, а затем используйте fade in для ссылок, как указано выше.