Я пытаюсь заставить 2 вещи затухать, один, когда одна ссылка выбрана, а другая, когда выбрана другая ссылка?

Question

Справа, у меня есть 4 divs, я хочу, чтобы 1 и 3 исчезали при нажатии ссылки, а 2 и 4 исчезали при нажатии на другую кнопку. Я использую JQuery. Вот что у меня до сих пор:

<div id="video selector" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px; margin-bottom:13px;"> 
<a href="#"> 
    <script> 
    $(document.body).click(function() { 
     $("#1").fadeIn("slow"); 
     $("#3").fadeIn("slow"); 
     $("#2").hide(); 
     $("#4").hide(); 
     }); 
    </script> 
    <img src="img/electronic recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9px; cursor:pointer;" /> 
    </a> 
    <center>Electronic Recycling</font></center> 
    </div> 

Это одна загружается дивы 1 и 3.

<div id="video selector2" style="float: right; width: 250px; background-color:#f3f3f3; height: 210px;"> 
<a href="#"> 
    <script> 
     $(document.body).click(function() { 
      $("#2").fadeIn("slow"); 
      $("#4").fadeIn("slow"); 
      $("#1").hide(); 
      $("#3").hide(); 
     }); 
    </script> 
    <img src="img/battery recycling play.png" style="width:220px; padding-left:15px; padding-top:12px; padding-bottom:9px; cursor:pointer;" /> 
    </a><center>Battery Recycling</font></center> 
    </div> 

Это одна загружается дивы 2 и 4.

Проблема в том, что они, как загружайте те же divs (2 и 4), и видео не переключается, просто перезагружает одну и ту же кнопку, нажатие кнопки вы нажимаете ... любые идеи?

Answer 1

Добавить идентификатор в свой тег, как это:

<a href="#" id="firstlink"> ... </a> 

Затем в готовую функцию документа добавить обработчик событий нажмите так:

<script> 
$(document).ready(function() { 
    $("#firstlink").click(function(){ 
    $("#1").fadeIn("slow"); 
    $("#3").fadeIn("slow"); 
    $("#2").hide(); 
    $("#4").hide(); 
    }); 
    }); 
</script> 

Приведенный выше код может пойти в голову вашей страницы, а не в содержании тега. Он добавляет обработчик событий таким образом, что при нажатии тега с идентификатором firstlink он выполняет функцию. Аналогичную функцию можно выполнить для следующей ссылки.