javascript - Bootstrap Modals keep adding padding-right to body after closed -
you can check bug video.
i tried put code in javascript:
$('.modal').on('hide.bs.modal', function (e) { $("element.style").css("padding-right","0"); });
doesn't work. know how fix this? can see website here.
user , password: admin/ koodaus1
code:
<button type="button" class="btn btn-lg btn-default" data-toggle="modal" data-target="#loginmodal">admin panel</button> <div id="loginmodal" class="modal fade" role="dialog"> <div class="modal-dialog modal-sm"> <!-- modal content --> <div class="modal-content"> <!-- header --> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">login</h4> </div> <!-- body --> <div class="modal-body text-center" > <input class='form-control' type="text" id="username" placeholder="username" ng-model='username'> <input class='form-control' type="password" id="password" placeholder="password" ng-model='password'> <div class="modal-footer"> <button type="button" class="btn btn-default" id="loginbutton" ng-click="gotoadminpanel()">login</button> <button type="button" class="btn btn-default" data-dismiss="modal" id="closebutton">close</button> </div> </div> </div> </div> </div> <div id="adminpanel" class="modal fade" role="dialog"> <div class="modal-dialog modal-lg"> <!-- modal content --> <div class="modal-content"> <!-- header --> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">admin panel</h4> </div> <!-- body --> <div class="modal-body" > </div> <div class="modal-footer"> <button type="button" class="btn btn-default" id="savebutton">save</button> <button type="button" class="btn btn-default" data-dismiss="modal" id="closebutton">close</button> </div> </div> </div> </div>
$scope.gotoadminpanel = function(){ parse.user.login($scope.username,$scope.password,{ success: function(user){ $('#loginmodal').modal('hide'); $('#adminpanel').modal(); }, error: function(user, error) { alert('wrong username and/or password'); } }); }
this might glitch bootstrap modal. tests, seems problem #adminpanel
being initialized while #loginmodal
has not been totally closed yet. workarounds can removing animation removing fade
class on #adminpanel
, #loginmodal
or set timeout (~500ms) before calling $('#adminpanel').modal();
. hope helps.
Comments
Post a Comment