Абсолютные дивы не исчезают

Question

у меня есть к вам вопрос

это xhtml

<div id="main">
    <div id="category1">
        <div id="product1"></div>
        <div id="product2"></div>
        <div id="product3"></div>
    </div>

    <div id="category2">
        <div id="product4"></div>
        <div id="product5"></div>
        <div id="product6"></div>
    </div>

</div>

концепция:

• по умолчанию # container1 отображается на сайте
• при нажатии на меню «container2» # container2 исчезает, а # container1 исчезает
• У меня есть меню второго уровня для выбора продуктов ... и это единственное, что отлично работает.

productX находится в абсолютном положении внутри контейнераX, которые связаны между собой

мне кажется, что сценарий отлично работает, но div продуктов совсем не исчезает!

это скрипт

function controlCategory(a) {
   $("#category1").fadeOut();
                        $("#category2").fadeOut();
   $(a).fadeIn();
 }



     $(function () {

  $("#anchor1").click(function(event) {
   event.preventDefault();
   controlCSS(this);
   controlCategory("#category1");
  });

           $("#anchor2").click(function(event) {
   event.preventDefault();
   controlCSS(this);
   controlCategory("#category2");
  });

 });

кто-нибудь знает, почему категория div не исчезает ????

заранее спасибо!

Answer 1

Обновление для обновленного вопроса: код, который вы опубликовали, работает, хотя это немного затрудняет затухание, вы можете проверить его здесь . Что-то за пределами ваш вопрос (возможно, родитель скрыт?) Вмешивается здесь.

---

Предыдущий ответ: Ваши идентификаторы не совпадают, у вас есть #category1 для вашего селектора, но ваши элементы имеют id="container1", поэтому ваши селекторы jQuery просто не находят никаких элементов. Просто измените обе стороны, чтобы они совпали.

Answer 2

Является ли код javascritpt для HTML-кода? В html у вас есть идентификаторы containerX, а в вашем javascript - идентификаторы categoryX.