|
Michael
|
March 13, 2019 at 8:00 pm
Hi, I have an issue with the modal for the waiting list add-on. When I select the “join waiting list” button, the modal slides in, but it goes half way of the page height, not half way of the viewport. So, if my page is 2000px tall, and my viewport is 600px tall, it slides past the viewport to 1000px instead of centering in the viewport.
Please see this screen shot:
https://www.evernote.com/l/APfZOV_Ke4lLsp4Dd1TXB8yrGM16jmdn02g
Thank you!
|
|
Michael
|
March 18, 2019 at 10:19 am
Hi… following up. Thanks!
|
|
Josh
|
March 18, 2019 at 3:34 pm
Hi,
It might be half the viewport depending on the size of the viewport, but what’s actually happening there is the modal is being absolute positioned -225 pixels from the top of the Join Wait list button. What you could do is bump that value so it positions the modal further up the page. e.g. add this to your custom stylesheet:
.event_wait_list-hidden-inputs {
top : -500px;
animation : modal_drop .5s;
-moz-animation : modal_drop .5s; /* Firefox */
-webkit-animation : modal_drop .5s; /* Safari and Chrome */
-o-animation : modal_drop .5s; /* Opera */
-ms-animation : modal_drop .5s; /* IE */
}
/* Animation Effects */
@keyframes modal_drop {
from {
top : -600px;
opacity : 0
}
to {
top : -500px;
opacity : 1
}
}
/* Firefox */
@-moz-keyframes modal_drop
{
from {
top : -600px;
opacity : 0
}
to {
top : -500px;
opacity : 1
}
}
/* Safari and Chrome */
@-webkit-keyframes modal_drop
{
from {
top : -600px;
opacity : 0
}
to {
top : -500px;
opacity : 1
}
}
/* Opera */
@-o-keyframes modal_drop
{
from {
top : -600px;
opacity : 0
}
to {
top : -500px;
opacity : 1
}
}
/* IE */
@-ms-keyframes modal_drop
{
from {
top : -600px;
opacity : 0
}
to {
top : -500px;
opacity : 1
}
}
|
|
Michael
|
March 18, 2019 at 6:35 pm
Thanks you!
|
