• 0

[Jquery/CSS] Centering a popup window in the screen?


Question

Hello, im trying to make a popup appear in the center of the viewers screen when a button is clicked.

It works fine so far if you dont scroll down, but if you do, then the popup stays at the top and you never see it.

You can see what I mean here: http://www.newtuts.com.

(You have to click on the little red (!) icon.)

How can I fix this?

Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0

In the popup's CSS (and the background overlay CSS), you need to set the positioning to "fixed".

e.g.

.popup
{
	position:fixed;
}

However, this won't work in IE6/7 (which don't support the "Fixed" position value), so you'll have to use some sort of javascript, or CSS "Expression" (which are IE only, and not recommended) for that.

If you're using JQuery though, why don't you use the JQuery UI Dialog Widget, which handles all this for you?

Link to comment
Share on other sites

  • 0
In the popup's CSS (and the background overlay CSS), you need to set the positioning to "fixed".

e.g.

.popup
{
	position:fixed;
}

However, this won't work in IE6/7 (which don't support the "Fixed" position value), so you'll have to use some sort of javascript, or CSS "Expression" (which are IE only, and not recommended) for that.

If you're using JQuery though, why don't you use the JQuery UI Dialog Widget, which handles all this for you?

I had never even heard of that widget. Im trying to use it now though, and nothing is happening.

In my Jquery code, i put

$(document).ready(function(){

//deadlink dialog
$(function(a[name=deadlink]) {
	$("#deadlink").dialog({
		bgiframe: true,
		height: 140,
		modal: true
	});
});

});

However, nothing is happening.

Edited by wvcaudill2
Link to comment
Share on other sites

  • 0
No problem, by the way, I think I marked one of your links as dead by accident, so I apologise :laugh:

Yeah I saw that :p No harm done.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.