Показать сообщение отдельно

  #11  
Старый 06.01.2009, 21:20
Zitt
Познавший АНТИЧАТ
Регистрация: 07.05.2006
Сообщений: 1,031
Провел на форуме:
5885100

Репутация: 773


По умолчанию

если в div.popup позицию указать в пикселях, то драг работает нормально. с процентами не работает... потому что не может определить начальную позицию элемента. как сделать так, чтобы див попап был по центру выше всех, и при этом работало его перетаскивание?

Код HTML:
<style>
div.popup
{
   position: absolute;  
   overflow: auto;  
   width: 500px;  
   left: 50%; 
   top: 20%;  
   margin-left: -250px;  
   background: #efefef;  
   padding: 8px;
   border: 1px solid silver;
   text-align: right;
}
div.popup div.content
{
	border: 1px solid silver;
	padding: 10px;
	background-color: white;
	text-align: justify;
	font-size: 13px;
	font-family: Tahoma;
	cursor: default;
}
div.popup img
{
	padding: 3px;
	padding-top: 0;
	padding-left: 0;
	cursor: pointer;
}
span.button_close
{
	height: 30px;
	padding: 5px;
	border: 1px solid silver;
	background: url('button_bg.png') repeat-x;
	font-size: 11px;
	font-family: Tahoma;
	cursor: pointer;
}
span.button_close:hover
{
	background: url('button_bg_hover.png') repeat-x;
}
.p-right
{
	text-align: right;
}
.b-top
{
	border-top: 1px solid silver;
}

</style>
<script>
kernel = {
	HideElement:function(element)
	{
		document.getElementById(element).style.display = 'none';
	},
}
visual = {
	flag: false,
	shift_x: false,
	shift_y: false,
	
	
	StartDrag:function(itemId, e)
	{
		if(!e)
		{
			e = window.event;
		}
		this.flag = true;
		this.shift_x = e.clientX-parseInt(itemId.style.left);
		this.shift_y = e.clientY-parseInt(itemId.style.top);

		if(e.stopPropagation)
		{
			e.stopPropagation();
		} else {
			e.cancelBubble = true;
		}
		
		if(e.preventDefault)
		{
			e.preventDefault();
		} else {
			e.returnValue = false;
		}
	},
	EndDrag:function()
	{
		this.flag = false;
	},
	Drag:function(itemId, e)
	{
		if(!this.flag)
		{
			return;
		}
		
		if(!e)
		{
			e = window.event;
		}
		itemId.style.left = (e.clientX-this.shift_x) + "px";
		itemId.style.top = (e.clientY-this.shift_y) + "px";

		if(e.stopPropagation)
		{
			e.stopPropagation();
		} else {
			e.cancelBubble = true;
		}
		
		if(e.preventDefault)
		{
			e.preventDefault();
		} else {
			e.returnValue = false;
		}
	}
}
</script>
<div class="popup" id="popup">    
	<img src="close.png" alt="{CLOSE_WINDOW}" width="16" height="16" onclick="kernel.HideElement('popup')" />
	<div class="content">
	Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello Hello 
		<div class="p-right b-top">
			<br /><span class="button_close" class="save">Сохранить</span>
		</div>
	</div>
</div>
 
Ответить с цитированием