Cropped fluidbox inside block with overflow:hidden
Opened this issue · 0 comments
nixprosoft commented
When images inside bootstrap modal, for example,
then clicked image crops like that (canvas limited by block overflow restrictions):
When overflow:hidden
of block was removed, then:
If there any method to change fluidbox overlay placement to <body>
, for example? Or any block outside modal?
Full HTML:
<div class="modal fade" tabindex="-1" aria-hidden="true" id="modal-3" aria-labelledby="modal-3-label">
<div class="modal-dialog modal-xl modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content rounded-0 border-4 border-warning">
<div class="modal-body text-center">
<button type="button" class="btn-close float-end" data-bs-dismiss="modal" aria-label="Close"></button>
<div class="p-5">
<h5 class="text-center display-4" id="modal-3-label">Навес 6х6</h5>
<div class="row">
<div class="col-lg">
<a href="/img/naves6x6_big.jpeg" class="lightbox">
<img src="/img/naves6x6.jpeg" class="img-fluid" alt="">
</a>
</div>
<div class="col-lg">
<a href="/img/naves6x6hb_big.jpeg" class="lightbox">
<img src="/img/naves6x6hb.jpeg" class="img-fluid" alt="">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
And JS was:
$('.lightbox').fluidbox();