Вообщем в javascript я ноль сделал на css слайдер с position: absolute; слайдер открывается в верху окна и закрывает собой весь текст страницы, но если покрутить мышкой то открывается скрытое содержимое страниц
пример кода
<body class="home">
<div class="body" itemscope itemtype="http://schema.org/LocalBusiness"><div class="thumbnail" style="position:relative;display:inline-block;">
<a href="#image-1"><img class="magnifier" alt="Лупа" title="лупа" src="../uvel.png" />
<img src="https://virink.com/storage/17/01/15/968e96612cafe3f0f9f2b079d09b72e9.jpg" alt="Сплав по реке Чарыш" class="nev" /></a>
</div>
<div class="Ib-fon" id="image-1">
<div class="Ib-konteiner">
<div class="Ib-imgkont">
<a rel="nofollow" href="#image-2" ><div class="lb-next"></div></a>
<a rel="nofollow" href="#page"><div class="lb-close"></div></a>
<a rel="nofollow" href="#image-7"><div class="lb-prev"></div></a>
<img src="https://virink.com/storage/17/01/15/968e96612cafe3f0f9f2b079d09b72e9.jpg" alt="Сплав по реке Чарыш" />
</div>
</div>
</div>
</div>
как мне зафиксировать <div class="body"> при нажатии на <a href="#image-1"><img class="magnifier" alt="Лупа" title="лупа" src="../uvel.png" />
<img src="https://virink.com/storage/17/01/15/968e96612cafe3f0f9f2b079d09b72e9.jpg" alt="Сплав по реке Чарыш" class="nev" /></a>, а при нажатии <a rel="nofollow" href="#page"><div class="lb-close"></div></a> все возвращалась назад. скрипт также должен работать для <a href="#image-1">,<a href="#image-2"><a href="#image-3"> ..... <a href="#image-7">
при клике на #image-1 открывается вот такой слайдер
а при нажатии #page закрывается.
нужно чтоб при прокрутки стронички содержимое под слайдером не появлялась как на рисунки -
тоесть зафиксировать div c клаcсом body