Maintain scroll position about alertifyjs HOT 9 CLOSED

I even removed the href attribute and it still scrolls page to the top.

from alertifyjs.

As far as i can see, even plain alertify.alert("test"); scrolls page to the top after clicking OK.

from alertifyjs.

That's because you are using # as your href, use <a href="javascript:void(0);" ...></a> instead.

from alertifyjs.

Hi,

I already tried that. Actually, it's not about the HREF. It even scrolls just after any alertify call. Haven't found what it causes yet. It intersects somehow with another jQuery code but i can't see where. Still looking into it.

Do you have any tips how to debug JS code? I set a breakpoint, but it didn't help, just passed it and that's all.

Thank you.

from alertifyjs.

I just commented ALL my code and leave only:

$(document).ready(function() {
$('.ratesbtn2').on('click', function(e){
e.stopPropagation();
alertify.alert("123");
e.preventDefault();
return false;
});
}

and it's still reproducible.

from alertifyjs.

Just found. Setting CSS like:

body, html {
width: 100%;
height: 100%;
}

makes Alertify behave like i described. Do not know why. Is it a my mistake?

Thank you.

from alertifyjs.

I was able to reproduce this using Safari on windows, Seems related to setting focus to the dialog while body overflow is removed.

Setting tabindex="0" on your link will make the dialog return focus to the element when the dialog is closed.

Also you can use a custom alert that sets no focus to any of the dialog elements:

alertify.dialog('customAlert', function () {
  return {
    setup: function () {
      return {
        buttons: [
          {
            text: alertify.defaults.glossary.ok,
            key:  27/*ESC*/,
            className: alertify.defaults.theme.ok,
          }
        ],
        focus: {
          element: function(){
            /*Returning false will focus nothing, but it will make
               contents behind the modal accessible via Tab key.
            */
            return false;
          },
          select: false
        },
        options: {
          maximizable: false,
          resizable: false
        }
      };
    },
  }
}, false, 'alert');

I need to investigate this more...

from alertifyjs.

Include this in your document.ready function to maintain scroll position:

var lastX,lastY;
alertify.alert().set({
      'onshow':function(){
        lastX = window.scrollX;
        lastY = window.scrollY;
      },
      'onfocus':function(){
        window.scrollTo(lastX, lastY);
      }  
  }); 

I'll add this to the core script on next update.

Thanks.

from alertifyjs.

Hi,

Thank you for your help!

from alertifyjs.