Center pop-up in window

[ericjacksonwood]

I just started using Avgrund for a project, and it's working really well.

I have an <iframe> containing a video from youtube popping up, and it seems to be working well so far. However, the pop-up is opening at the top of the page, instead of in the center. Is there any easy fix for this?

[voronianski]

Hi, thanks

Actually it should be opened in the center of the page, could you share a demo with a bug?

[wunderco]

Hey Eric,
Im also having the same issue.

Ive been toying with it on http://www.wunder.co/index1.html
Scroll to the very bottom left and there is a little blue icon next to the copyright. Thats the trigger.

It looks like the popup is appearing y=-150px. Not sure how to bring this down.

Thanks!!

[phuongnd08]

I'm experiencing it as well. If you scroll down a bit long, then the popup seem to be hidden from the page. Change the position to fixed doesn't work neither. I guess this is a bug with browser when scale is applied?

[phuongnd08]

Look like scale is the cause. I remove all scale declaration from CSS and the dialog is aligned perfectly centered on the page.

[wunderco]

Hey! Thanks for writing back. Quick question, if I killl the scale in
body.avgrund-active {
overflow: hidden;
transform: scale(0.9);
}

It works great. Except, the background no longer scales out. Any ideas?

Lauren Wunderlich
UX/UI Visual Designer
www.wunder.co
p: 609.206.4812

On Sat, Sep 21, 2013 at 3:59 AM, Phuong Nguyen notifications@github.comwrote:

Look like scale is the cause. I remove all scale declaration from CSS and
the dialog is aligned perfectly centered on the page.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/41#issuecomment-24858018
.

[phuongnd08]

Scale is the heart of the effect. As you remove the scale, the effect is removed. My guess of a solution is that you can put the whole document in a single container did (instead of the body tag) and scale that did instead. Put the popin out of that scaled div so that it can be positioned properly.

[wunderco]

Ok thanks! Will give it a try :)

Lauren Wunderlich
UI/UX Design
www.wunder.co
609.206.4812

On Sep 21, 2013, at 10:32 PM, Phuong Nguyen notifications@github.com wrote:

Scale is the heart of the effect. As you remove the scale, the effect is removed. My guess of a solution is that you can put the whole document in a single container did (instead of the body) and scale that did instead. Put the popin out of that scaled div so that it can be positioned properly.

—
Reply to this email directly or view it on GitHub.

[voronianski]

@wunderco @phuongnd08 I'm trying to fix this now, this scale stuff is a bit tricky and @phuongnd08's proposal is considered to be a solution but for now I don't think it's the best variant to wrap user's content with one more container (if no better solution will be found I think it can be optionate then).

[voronianski]

@wunderco @phuongnd08 also I'm thinking about scrolling user up to the top of page.. what do you think?

[wunderco]

Ahh yea, but mine is off and above the view. Plus the rest if the site ends up scrolling you up. I still don't understand why it works sans issues on the demo? Is it wrapped up in a container as mentioned?

Lauren Wunderlich
UI/UX Design
www.wunder.co
609.206.4812

On Sep 22, 2013, at 8:08 AM, Dmitri Voronianski notifications@github.com wrote:

@wunderco @phuongnd08 also I'm thinking about scrolling user up to the top of page.. what do you think?

—
Reply to this email directly or view it on GitHub.

[voronianski]

@wunderco demo doesn't contain long content on it, you can checkout how positioning of child inside scaled container behaves here - http://labs.voronianski.com/test/scaled-positioning.html

[codehandling]

Do we have a fix or a workaround for this ? I just cant use the popup if my trigger is down the page, because the popup is positioned on top...

Please let me know.

Thanks.

[codehandling]

Workaround - Can you calculate the pixels from the top (pixels scrolled down) in the onLoad function and set the popup's height accordingly ???

[wunderco]

Hey Jake,
Unfortunately, I have moved away from the pop up... my timebox ended for
that work.

Thanks!
Lauren

Lauren Wunderlich
UX/UI Visual Designer
www.wunder.co
p: 609.206.4812

On Fri, Nov 1, 2013 at 12:47 PM, Jake notifications@github.com wrote:

Workaround - Can you calculate the pixels from the top (pixels scrolled
down) in the onLoad function and set the popup's height accordingly ???

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/41#issuecomment-27580144
.

[the-de-coder]

I have the same issue. Got this all setup, and now if I use a trigger low on a long page, the pop-in is way up where the user cannot see it.

Please advise