Форум

Nirfik · #1 (**permalink**) 13.11.2014, 21:38

кратко:значит есть div(корзина) и в нем div(товары) при помощи php я загружаю название и описание товара, и при нажатии на корзину она сворачивается, а при нажатии на товар он либо раскрывает описание товара либо скрывает если таковое имеется,НО ПРИ НАЖАТИИ НА ТОВАР ФАКТИЧЕСКИ ПОД НАЖАТИЕ ПОПАДАЕТ И САМА КОРЗИНА!!! я только учусь программировать на jquery плиз помогите!

<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="//code.jquery.com/jquery-git.js"></script>
  <meta charset="utf-8">
  <title>корзина</title>
</head>
<body>
  <div class="basket">
    <div id="name1">
      <p>товар 1</p>
      <div>описание</div>
    </div>
    <div id="name2">
      <p>товар 2</p>
      <div>описание</div>
    </div>
  </div>
</body>
</html>

$('.basket, .basket > div').click(function(){
  $(this).fadeToggle(1000);
});

и может если не сложно посоветуете книгу по js и jquery, а то их много

рони · #2 (**permalink**) 13.11.2014, 22:47

Nirfik,
отмени всплытие

$(function(){
$('.basket, .basket > div').click(function(event){
  event.stopPropagation();
  $(this).fadeToggle(1000);
});
 })

рони · #3 (**permalink**) 13.11.2014, 22:56

Nirfik,
или так

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.basket p{
  cursor: pointer;
}
.basket p ~ div{
    display: none;
}
</style>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script> $(function(){
$('.basket p').click(function(event){
  $(this).nextAll('div').fadeToggle(1000);
});
 })
</script>
  <meta charset="utf-8">
  <title>корзина</title>
</head>
<body>
  <div class="basket"> <p>корзина</p>
    <div id="name1">
      <p>товар 1</p>
      <div>описание</div>
    </div>
    <div id="name2">
      <p>товар 2</p>
      <div>описание</div>
    </div>
  </div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript