javascript - Bootstrap image gallery always opens at top of page -


i'm using bootstrap image gallery blueimp. i've placed container @ bottom of index.cshtml page:

<div id="blueimp-gallery" class="blueimp-gallery blueimp-gallery-controls">     <div class="slides"></div>     <h3 class="title"></h3>     <a class="prev">‹</a>     <a class="next">›</a>     <a class="close">×</a>     <a class="play-pause"></a>     <ol class="indicator"></ol> </div> 

here's example anchor tag links gallery:

<a href="~/images/press/french/babybook-couv-p-ete-2014.png"    target="_blank" data-gallery="#blueimp-gallery">   <img src="~/images/press/french/thumbs/babybook-couv-p-ete-2014.jpg"      class="img-responsive magazine" /> </a> 

when click open gallery, opens @ top of page. think these css rules control position:

.blueimp-gallery {   position: fixed;   z-index: 999999;   overflow: hidden;   background: #000;   background: rgba(0,0,0,.9);   opacity: 0;   display: none;   direction: ltr;   -ms-touch-action: none;   touch-action: none; }  .blueimp-gallery, .blueimp-gallery>.slides>.slide>.slide-content {   position: absolute;   top: 0;   right: 0;   bottom: 0;   left: 0;   -moz-backface-visibility: hidden; } 

the position:fixed , top:0, right:0, bottom:0, left:0 have gallery opening @ top of page.

is there way have gallery open right user on page, when close gallery, returns them original location? or there way know user on page , return him/her spot after gallery closed?

all these solutions workarounds, had same issue blueimp-gallery , realized happening because library hides page scroll bar default, , when open goes straight top.

so in options set hidepagescrollbars:false

when initilialize library:

blueimp.gallery(links,{hidepagescrollbars:false}); 

Comments

Popular posts from this blog

java - Spring Data JPA: Why findOne(id) executing delete query internally? -

python - Mongodb How to add addtional information when aggregating? -

java - Incorrect order of records in M-M relationship in hibernate -