JavaScript/task03.html at lesson06_task03 · AlexN-github/JavaScript · GitHub

X Tutup

109 lines (107 loc) · 4.78 KB

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU"

crossorigin="anonymous">

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"

crossorigin="anonymous">

<link rel="stylesheet" href="style.css">

</head>

<body>

<div class="container">

<nav class="navbar navbar-light bg-dark">

<div class="btn-group ml-auto">

<button class="btn btn-light btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true"

aria-expanded="false">

Корзина

</button>

<div class="dropdown-menu dropdown-menu-right basketPanel">

<table class="table table-hover">

<thead>

<tr>

<th scope="col">ID</th>

<th scope="col">Имя</th>

<th scope="col">Цена</th>

<th scope="col">Количество</th>

<th scope="col"></th>

</tr>

</thead>

<tbody></tbody>

<tfoot>

<tr>

<th colspan="2" scope="row">Итого:</th>

<td colspan="3">

<span class="total">0</span>

<i class="fas fa-ruble-sign"></i>

</td>

</tr>

</tfoot>

</table>

</div>

</div>

</nav>

<br>

<div class="row">

<div class="col-4">

<div>Товар 1</div>

<img src="https://placeimg.com/640/480/nature" alt="..." class="img-thumbnail">

<div>

<span class="productPrice">120</span>

<i class="fas fa-ruble-sign"></i>

</div>

<button type="button"

class="btn btn-success mt-3 toBasketBtn"

data-id="1"

data-price="120"

data-name="Товар 1"

>

В корзину

</button>

</div>

<div class="col-4">

<div>Товар 2</div>

<img src="https://placeimg.com/640/480/arch" alt="..." class="img-thumbnail">

<div>

<span class="productPrice">75</span>

<i class="fas fa-ruble-sign"></i>

</div>

<button type="button"

class="btn btn-success mt-3 toBasketBtn"

data-id="2"

data-price="75"

data-name="Товар 2"

>

В корзину

</button>

</div>

<div class="col-4">

<div>Товар 3</div>

<img src="https://placeimg.com/640/480/tech" alt="..." class="img-thumbnail">

<div>

<span class="productPrice">3000</span>

<i class="fas fa-ruble-sign"></i>

</div>

<button type="button"

class="btn btn-success mt-3 toBasketBtn"

data-id="3"

data-price="3000"

data-name="Товар 3"

>

В корзину

</button>

</div>

</div>

</div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"

crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49"

crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy"

crossorigin="anonymous"></script>

<script src="script.js"></script>

</body>

</html>

X Tutup