Сообщение от ctpz
|
щу готовый, чтобы посмотерть как сделано и сделать свой.
|
в гугле миллионы таких скриптов, вы просите нас искать вам решение?
примерный псевдокод для выравнивания элемента по центру:
Element.css({
position: 'fixed',
top : (window.height - Element.outerHeight()) / 2 + 'px',
left : (window.width - Element.outerWidth()) / 2 +'px'
});
Есть у меня небольшой плагин (стильники и разметка на работе) с использованиеи jQuery, очень простой лайтбокс:
/**
* Modalbox is an implementation of non-standard modal window
* Use:
* $('.modalbox').modalbox({
* close : '.close'
* fade : 100,
* });
* Licensed under the MIT
*
* @author: Alexander Guinness
* @version: 1.0
* @this: {jQuery Object}
* @params {fade} sets jQuery method fadeIn();
* @params {close} jQuery Object
* @params {id} unique id for Modalbox
* @date: Mon Jun 01 10:00:00 2011
**/
$.fn.extend({
modalbox: function(options) {
var _this = this,
$window = $(window),
//значения по-умолчанию
setts = $.extend({
fade : 300,
close : '',
id : '#modalbox'
}, options),
//выравнивание элмента по цетру
center = function() {
_this.css({
position: 'fixed',
top : ($window.height() - _this.outerHeight()) / 2 + 'px',
left : ($window.width() - _this.outerWidth()) / 2 +'px'
})
.fadeIn(setts.fade);
}
//фотновое затемнение
!$(setts.id)[0] ? $('<div />', {
id : setts.id.substring(1)
}).append(this).appendTo('body') : $(setts.id).show();
$(setts.close).click(function(event) {
$(setts.id).fadeOut(setts.fade);
event.preventDefault();
});
//скрытие окна
hideOverlay(setts.id, 'fadeOut', setts.fade);
center();
//пользовательское изменение размеров окна
$window.resize(center);
return this;
}
});
//HIDE OVERLAY
/**
* hideOverlay is an implementation of hideOverlay function
* Use: hideOverlay('id', 'fadeIn', 300);
* Licensed under the MIT
*
* @author: Alexander Guiness
* @version: 1.0
* @params {id} HTML identifier (id, class, etc...);
* @params {method} jQuery method (hide, show, fadeIn, etc..)
* @params {params} jQuery method's value
* @date: Mon Jan 01 10:00:00 2011
**/
function hideOverlay(id, method, params) {
var $id = $(id),
setts = {
isVisible : function() {
return $id.is(':visible');
},
isCall : function() {
return $id[method](params);
}
};
$(document).bind({
click : function(event) {
if(setts.isVisible() && !$(event.target).andSelf().parents(id)[0]) {
setts.isCall();
}
},
keydown : function(event) {
if(setts.isVisible() && event.which == 27) {
setts.isCall();
}
}
});
}
Сообщение от розовый слоник
|
начинай копать отсюда и до забора
|
вообще не в тему
вот это нужно:
http://javascript.ru/blog/Andrej-Par...enta-elementov
http://javascript.ru/ui/offset+
http://javascript.ru/tutorial/events/crossbrowser