Нашел пример кнопки для сайта. Настроил графическую часть, но при создании еще одной кнопки по этому коду позникли проблему: все кнопки открывают окно первой. Как настроить корректную работу? Если надо присвоить ID, каждой из них, напишите пожалуйста как это сделать.
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf8'>
<link rel="stylesheet" href="http://wwwwww.ucoz.net/sss.css" type="text/css" />
<style type="text/css">
#wrap{
display: none;
opacity: 0.8;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
padding: 16px;
background-color: rgba(1, 1, 1, 0.725);
z-index: 100;
overflow: auto;
}
#window{
width: 600px;
height: auto;
margin: 50px auto;
display: none;
background: #fff;
z-index: 100;
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
padding: 16px;
}
.close{
margin-left: 530px;
margin-top: 4px;
cursor: pointer;
}
</style>
</head>
<body>
<script type="text/javascript">
//Функция показа
function show(state){
document.getElementById('window').style.display = state;
document.getElementById('wrap').style.display = state;
}
</script>
<!-- Задний прозрачный фон-->
<div onclick="show('none')" id="wrap"></div>
<!-- Само окно-->
<div id="window">
<!-- Картинка крестика-->
<img class="close" onclick="show('none')" src="http://sergey-oganesyan.ru/wp-content/uploads/2014/01/close.png">
<p style="text-align: center;"><span style="font-size:24px;">Bluedio H+</span></p>
<br>
<br><br><br><p><span style="line-height: 18.9091px;">Удобным и многофукнциональным наушникам Bluedio H+ найдется применение практически везде. Вы можете использовать их для разговора (в наушниках есть встроенный микрофон с функцией шумоподавления) или для прослушивания музыки. Чистый звук и мощные басы позволят вам сполна насладиться любимыми произведениями, а наличие слота под MicroSD и встроенного радио позволяет использовать Bluedio H+ как самостоятельное устройство без синхронизации с телефоном.</span><br style="line-height: 18.9091px;" />
</p>
<table border="0" cellpadding="0" cellspacing="0" style="line-height: 18.9091px; width: 447px;">
<tbody>
<tr>
<td style="height: 25px; width: 251px;">Версия bluetooth:</td>
<td style="width: 196px;">4,1</td>
</tr>
<tr>
<td style="height: 25px;">Рабочее расстояние:</td>
<td>до 10 метров</td>
</tr>
<tr>
<td style="height: 25px;">Bluetooth профили:</td>
<td>A2DP, AVRCP, HFP, HSP</td>
</tr>
<tr>
<td style="height: 25px;">Частотная ххарактеристика:</td>
<td>20 Гц - 20 ГГц</td>
</tr>
<tr>
<td style="height: 25px;">Время активной работы:</td>
<td>45 часов</td>
</tr>
<tr>
<td style="height: 25px;">Время ожидания:</td>
<td>1625 часов</td>
</tr>
<tr>
<td style="height: 25px;">Время зарядки:</td>
<td>3 часа</td>
</tr>
<tr>
<td style="height: 25px;">Коэф. искажений:</td>
<td><0,1%</td>
</tr>
<tr>
<td style="height: 25px;">Чувствительность:</td>
<td>110 Дб</td>
</tr>
<tr>
<td style="height: 25px;">Встроенный микрофон:</td>
<td>Да</td>
</tr>
<tr>
<td style="height: 25px;">Доп. функции:</td>
<td>Радио, поддержка microSD</td>
</tr>
</tbody>
</table><br><br>
<center>
</center>
</div>
<center><button class="myButton" onclick="show('block')">О товаре</button></center>
</center>
</body>
</html>