search

fabien-d / alertify.js

JavaScript Alert/Notification System
http://fabien-d.github.com/alertify.js/
4.26k stars 726 forks source link

Mouse clicks do not bubble above .alertify-logs #208

Open DougPuchalski opened 10 years ago

DougPuchalski commented 10 years ago

When an alert is shown, .alertify-logs extends across the height of the page. Any mouse clicks that have underlying elements seem to be absorbed by alertify.

fabien-d commented 10 years ago

When a dialog is open, it creates an invisible cover that will disable all mouse clicks from happening on the underlying site. This is to "mimic" the behaviour of native dialogs.

Dialogs are used to force the user to take an action before being able to continue. This is intended behaviour.

DougPuchalski commented 10 years ago

I'm not referring to the alert window itself, but rather the transparent container which runs the entire vertical height of the window. Clicking on the alert itself closes it, but clicking anywhere below it absorbs the event, rather than passing it to the element below it.

fabien-d commented 10 years ago

I think we're talking about the same thing... you're issue is attempting to click a link on the page (behind the dialog)?

If so, that is blocked by design. If that's not what you mean - may need to provide a bit more info

DougPuchalski commented 10 years ago

I'm not intending to create a modal dialog to force the user to respond, but rather passive alerts, i.e. "you have been signed in" like a growl notification. I don't want them to prevent the site from being used. Did I miss somehow that the intention is that all log messages are supposed to be modal?

Incidentally, this overlay is only as wide as the alert, but the full height of the screen, so it's not blocking all events, just a portion of the screen.

By the way, thanks for providing this library.

fabien-d commented 10 years ago

I misunderstood - log messages should NOT block interaction. If that's what is happening then there could be a bug.

Could you provide a small code sample that recreates the issue? Also, which version/browser this is happening and I'll take a look

DougPuchalski commented 10 years ago

Ok, thanks for confirming expected behavior. I'm using Chrome by the way.

I did some more digging, and found that this can be fixed with CSS. Eliminating he bottom declaration resolves the issue and .alertify-logs shrink-wraps the contents.

I've made the change in #209.

Any side effects that you can think of?