I am trying to create a script that shows my login modal on page load. I have a button that opens the register modal and closes the login modal if clicked. Here is the script I am using:$(document).ready(function(){  $('#loginmodal').modal('show')});$(.hidelogopenreg).click( function()         {            $('#loginmodal').modal('hide')            $('#registermodal').modal('show')         } );Even though the works correctly, I fear it's using bad practices as I have little JavaScript knowledge and don't want to have to resolve problems further down the line.Is this correct and efficient or is there a better way of writing this?Another problem I had is that hiding a modal causes the body to shift to the right on close, to fix this I added:body {padding-right:0px !important;margin-right:0px !important;}Could this also cause problems for me?
Close modal and open new modal
javascript;jquery;css;twitter bootstrap
Could this also cause problems for me?As with most CSS questions, the answer is maybe. It really depends on the rest of your CSS. Personally, I try to stay away from !important but I can certainly understand your usage. As long as it isn't causing additional issues, I don't see a problem with it.Is this correct and efficient or is there a better way of writing this?I would recommend wrapping your code in an IIFE so as not to pollute the global scope and give yourself a safe private scope.  This also allows you to use $ for jQuery with no conflicts:(function( $ ) {  //code here })( jQuery );Next, if you see where you use the same jQuery selection more than once, you should just go ahead and cache it:var logModal = $('#loginmodal');I would also recommend that you use K&R style braces instead of Allman style.  This can help prevent issues you might encounter with JS.$(.hidelogopenreg).click( function() {  // opening on same line K&R style  $('#loginmodal').modal('hide')  $('#registermodal').modal('show')}Lastly, you need to end your lines of code with a semicolon. You can get away with this in some situations but can cause issues later on. More information here and here.  $('#loginmodal').modal('hide');  //end of line  $('#registermodal').modal('show');  //end of lineHere is the code with these changes:(function( $ ) {  var $logModal = $('#loginmodal');  var $regModal = $('#registermodal');  var $hideLogin = $(.hidelogopenreg);  function swapModals() {    $logModal.modal('hide');    $regModal.modal('show');  }  $(document).ready( function() {    $logModal.modal( 'show');    $hideLogin.on( 'click', swapModals );  });})( jQuery );Hope that helps.  Let me know if you have questions, comments or need clarification.