NanoModal icon indicating copy to clipboard operation
NanoModal copied to clipboard

howto position?

Open ghost opened this issue 9 years ago • 4 comments

the position of the popups seems "hardwired" into the css and on long pages the popup may easily end up "out of sight".

What would I do to ensure the popup is always displayed in the visible part of the page or near the mouse click? Can't seem to find the api to pass the position.

ghost avatar Jan 24 '16 14:01 ghost

This is the easy fix as seen in the readme:

.nanoModal.nanoModalOverride {
    position: fixed;
}

If you want it to be extra custom, you'll have to use js to position it yourself.

kylepaulsen avatar Jan 25 '16 04:01 kylepaulsen

doing it in JavaScript seem better in my case anyway. Do I need to take special care where exactly to the document I attach the css?

ghost avatar Jan 25 '16 18:01 ghost

You probably don't need to do anything more special than something like (when using jquery):

// if you want it near the mouse click
$(".nanoModal").css({
    top: mouseY + someOffset,
    left: mouseX + someOtherOffset
});

But this is just a guess.

kylepaulsen avatar Jan 25 '16 20:01 kylepaulsen

No jquery here, I am experimenting in the context of a PageMod script of a Firefox extension where I want very little external dependencies.

At the same time I am slightly nervous as it will is displayed over a webpage which is not under my control - my javascript is fully sandboxed but in theory the webpage could attempt to sabotage me by defining conflicting CSS.

ghost avatar Jan 25 '16 21:01 ghost