Hello.
the essence of the problem - there are many elements with markup as below. Onclick functions are hung on them.
document.addEventListener('DOMContentLoaded', function() { var goods = document.querySelectorAll('div.good'); for (var z = 0; z < goods.length; z++) { goods[z].onclick = function() { var text = this.querySelector('.details p').innerHTML; var img = this.querySelector('img').getAttribute('src'); alert(img + ' ' + text); }; } }); <div class="good"> <img src="/assets/img/good4.png"> <div class="details"> <div><span class="icon goods beef blue"></span> </div> <p>Курица по-тайски</p> <span class="price">299</span> </div> </div> <div class="good"> <img src="/assets/img/good2.png"> <div class="details"> <div><span class="icon goods beef blue"></span> </div> <p>Говядина томленая</p> <span class="price">228</span> </div> </div> As a result, the element on which we click does not correspond to what we get through this in the function. I can’t play, so I can only suggest to watch it live - music.redeye.pro (This is a click on the goods). Thank.
It is characteristic that this is manifested for the lower rows, and in this the upper ones fly over them.
