X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> скрывающийся слой
vasvas7775
vasvas7775
Topic Starter сообщение 25.12.2010, 11:52; Ответить: vasvas7775
Сообщение #1


Ребята такой вопрос, вот код окна с заданными размерами, оно появляется после нажатия на ссылку новое окно, А скрывается после нажатия крестика в этом окне. Вопрос такой как сделать чтобы окно валезало не в верхнем правом углу, а по центру экрана, или в любом месте которое я укажу. Уже все что знаю перепробовал, ничего не помогает.

[JS]<script>
function pos(event) {
var x = y = 0;
if (document.attachEvent != null) {
x = window.event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
y = window.event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
} else if (!document.attachEvent && document.addEventListener) {
x = event.clientX + window.scrollX;
y = event.clientY + window.scrollY;
} else {}
return {x:x, y:y};
}
function Show(id) {
id = document.getElementById(id);
id.style.left = pos(event).x;
id.style.top = pos(event).y;
id.style.display = 'block';
}
function Hide(id) {
id = document.getElementById(id);
id.style.display = 'none';
}
</script>
<a style="cursor: hand; text-decoration: underline" onclick="Show('poisk')">Новое окно</a>
<div id="poisk" style="position: absolute; display:none; background-color:#D8D8D8; width:400px; height:200px; border:solid 1px;">
<table border="0" width="100%">
<td></td><td align="right"><img src="KRESTIC" width="25px" height="25px" onclick="Hide('poisk')"></td><tr>
<td colspan="2">В скрывающимся слое, можно прописать, все что угодно.</td>
</table>
</div>[/JS]
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
www3_hb
www3_hb
сообщение 25.12.2010, 15:27; Ответить: www3_hb
Сообщение #2


Чтоб было позицирование надо использовать css
Вот например
[CSS].sloi{
position:absolute;
left:25%;
top:25%;
width:50%;
height:200px;
}[/CSS]
Это грубый пример но можно использовать за место % можно ставить px как вам надо будет
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
Topic Starter сообщение 27.12.2010, 12:39; Ответить: vasvas7775
Сообщение #3


Так, не получается.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
LifeUP
LifeUP
сообщение 27.12.2010, 14:01; Ответить: LifeUP
Сообщение #4


набросал на скорую руку.
Используй Jquery, очень удобная штука
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ Без Имени</title>
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$(document).ready (function(){

var w = document.documentElement.clientWidth;
var h = document.documentElement.clientHeight;
var pos = {'left': w / 2 - 200 + 'px', 'top': h / 2-200 + 'px'};

$('#open_hide_block').click(function(){
$('#hide_block p').click(function(){
$('#hide_block').hide();
});
$('#hide_block').css(pos).toggle();
});

});
</script>

<style type="text/css">
<!--
#hide_block { padding:10px; border:1px solid red; background-color:#ccc; width:400px; height:200px; position:absolute; display:none; }
#hide_block p { position:absolute; top:5px; left:395px; background-color:#0066FF; width:20px; height:20px; padding:0; margin:0; text-align:center; cursor:pointer; }
--
>
</style>
</head>

<body>
<a href="#" id="open_hide_block">Нажимай нежно</a>

<div id="hide_block">Я контент скрытого блока<p>x</p></div>
</body>
</html>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
Topic Starter сообщение 27.12.2010, 14:10; Ответить: vasvas7775
Сообщение #5


извини LifeUP, но не работает, скрытый блок вообще перестал выезжать.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
LifeUP
LifeUP
сообщение 27.12.2010, 14:14; Ответить: LifeUP
Сообщение #6


библиотеку то Jquery подключи))
вот отсюда скачай http://jquery.com/
Вот сам блок =) (чутка изменил)
[IMG]http://i016.radikal.ru/1012/08/3247367933c5t.jpg[/IMG]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
vasvas7775
vasvas7775
Topic Starter сообщение 27.12.2010, 14:41; Ответить: vasvas7775
Сообщение #7


Спасибо!........

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


 



RSS Текстовая версия Сейчас: 25.4.2024, 18:47
Дизайн