Reposition draggable modal every time modal is opened Discussions -


i have draggable modal window , users move around. want open @ original position, every time close window , reopen again. how can that? thanks.

you can use bootstrap modal events

show.bs.modal event fires when show instance method called. if caused click, clicked element available relatedtarget property of event.

by default bootstrap modal slide-down top , if position of modal changes while dragging, can rest original position show.bs.modal when close , re-open next time.

$('selector').on('show.bs.modal', function () {   // something... }); 

demo fiddle modal slide , open in middle

in above fiddle, added custom position modal modal slide , open in middle of page

.modalnewposition {     -webkit-transform: translatex(-0%) translatey(25%);     -moz-transform: translatex(-0%) translatey(25%);     -ms-transform: translatex(-0%) translatey(25%);     transform: translatex(-0%) translatey(25%); } 

html

<div id="mymodal" class="modal fade modalnewposition" role="dialog"> 

then created class

.original {     transform: translate(0px, 0px);     transition: transform 0.3s ease-out 0s;     transition: opacity 0.15s linear 0s; } 

using show.bs.modal added original selector modal adjust it's position before showing , override modalnewposition selector modal slide , open @ top instead in middle of page.

$(document).ready(function() {     $('#mymodal').on('show.bs.modal', function () {         $('.modal').addclass("original");     }); }); 

demo fiddle modal slide , open @ top

above example demonstrate asked achievable show.bs.modal function.


Comments