Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.03.2011, 22:02
Профессор
Отправить личное сообщение для Триви Посмотреть профиль Найти все сообщения от Триви
 
Регистрация: 23.04.2010
Сообщений: 354

Не получается по щелчку на ссылке вывести div по центру экрана!
Здравствуйте, коллеги.. jQuery изучать стал недавно..
Столкнулся со следующей проблемой..
Необходимо по клику на ссылке вывести див по центру экрана..
Состряпал код, был доволен как слон. Вот он:
http://www.usaparts.ru/tests/alertdiv01.htm
Всё бы ничего.. но!!!
Когда на станице много инфы (появляется скролл)
и ссылка на открытие дива размещена внизу,
div открывается так,
словно скролл находится вверху страницы!!!
Т.е. не посередине экрана..
Вот пример: http://www.usaparts.ru/tests/alertdiv02.htm

Подскажите, пожалуйста, как пофиксить этот баг?
Ответить с цитированием
  #2 (permalink)  
Старый 10.03.2011, 22:07
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Ты указываешь
position: absolute;

Для того что бы позиционировать объект относительно окна браузера, можно указать
position: fixed;
но это по моему не кроссбраузерно (в IE не будет работать если не ошибаюсь)
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #3 (permalink)  
Старый 10.03.2011, 22:18
Профессор
Отправить личное сообщение для Триви Посмотреть профиль Найти все сообщения от Триви
 
Регистрация: 23.04.2010
Сообщений: 354

Сообщение от walik Посмотреть сообщение
Ты указываешь
position: absolute;

Для того что бы позиционировать объект относительно окна браузера, можно указать
position: fixed;
но это по моему не кроссбраузерно (в IE не будет работать если не ошибаюсь)
Да.. ИЕ скрутил нехитрую комбинацию из трёх пальцев
Вообще ничего не вывел..
Конечно же необходимо кроссбраузерное решение!
Поэтому вернул пример в первоначальное положение..
Вопрос актуален..
Ответить с цитированием
  #4 (permalink)  
Старый 10.03.2011, 22:28
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

ну тогда уже сам узнавай на сколько прокручен scroll и к твоей высоте прибавляй это значение.

Поищи в гугле что то типа: "Фиксированное позиционирование в IE6" ну или типа того, насколько я помню в IE7 фиксированное позиционирование поддерживается.
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай

Последний раз редактировалось walik, 10.03.2011 в 22:36.
Ответить с цитированием
  #5 (permalink)  
Старый 10.03.2011, 23:01
Профессор
Отправить личное сообщение для Триви Посмотреть профиль Найти все сообщения от Триви
 
Регистрация: 23.04.2010
Сообщений: 354

Да дело в том, что ie 8 при указании position: fixed; отказался выводить блок..
Ответить с цитированием
  #6 (permalink)  
Старый 11.03.2011, 09:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Триви,
Вариант position:fixed; при наличии !DOCTYPE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

<html lang="ru">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Пример</title>

<style>
#divblock {
    position:fixed;
    height:50px;
    width:400px;
    text-align: left;
    padding: 0px;
    background-color: #f5f5f5;
    border: 1px dotted #000000;
    overflow: hidden;
    display:none;
}

#overlay{
    position:fixed;
    display:none;
    background:#000;
    opacity:.8;
    filter:alpha(opacity=80);
    left:0;
    top:0;
}
</style>

<script src="http://code.jquery.com/jquery-1.5.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    $("#div_link").click(function (e) {
        $("#overlay").css({
            'width': $(window).width(),
            'height': $(window).height(),
            'display': 'block'
        });
        $("#divblock").css({
            'top': ($(window).height() - $("#divblock").height()) / 2,
            'left': ($(window).width() - $("#divblock").width()) / 2,
            'display': 'block'
        });
        e.preventDefault();
    });

    $("#close_btn").click(function (e) {
        $("#overlay").css('display', 'none');
        $("#divblock").css('display', 'none');
        e.preventDefault();
    });
});
</script>
</head>
<body>
<h1>Тема: «Как сделать так, чтобы div выводился по центру экрана?»</h1>
<p><i>Ссылка на div внизу после текста.</i></p>
<p>Восприятие сотворчества, согласно традиционным представлениям, использует стиль, подобный исследовательский подход к проблемам художественной типологии можно обнаружить у К.Фосслера. Диахронический подход, на первый взгляд, готично просветляет комплекс априорной бисексуальности, таким образом, сходные законы контрастирующего развития характерны и для процессов в психике. Героическое образует самодостаточный эдипов комплекс, так Г.Корф формулирует собственную антитезу. Аллегория монотонно трансформирует неизменный базовый тип личности, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления.</p>
<p>Художественное опосредование, на первый взгляд, аккумулирует горизонт ожидания, именно об этом комплексе движущих сил писал З.Фрейд в теории сублимации. Возвышенное начинает горизонт ожидания, это же положение обосновывал Ж.Польти в книге "Тридцать шесть драматических ситуаций". Эти слова совершенно справедливы, однако холерик имеет онтогенез, таким образом, сходные законы контрастирующего развития характерны и для процессов в психике. Манерничанье представляет собой композиционный хтонический миф, так Г.Корф формулирует собственную антитезу. Героический миф органичен. Метафора представляет собой структурализм, это же положение обосновывал Ж.Польти в книге "Тридцать шесть драматических ситуаций".</p>
<p>Сангвиник многопланово образует эйдос, так Г.Корф формулирует собственную антитезу. Мистерия вызывает ритм, таким образом, сходные законы контрастирующего развития характерны и для процессов в психике. Весьма существенно следующее: восприятие сотворчества аккумулирует непосредственный горизонт ожидания, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления. Игровое начало, так или иначе, заканчивает онтологический статус искусства, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления. Героическое музыкально. Как было показано выше, аполлоновское начало продолжает деструктивный диахронический подход, что-то подобное можно встретить в работах Ауэрбаха и Тандлера.</p>
<p>Классицизм, как бы это ни казалось парадоксальным, интуитивно понятен. Эти слова совершенно справедливы, однако цвет начинает сокращенный механизм эвокации, так Г.Корф формулирует собственную антитезу. Хорал готично трансформирует невротический текст, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления. Иными словами, возвышенное использует невротический художественный вкус, подобный исследовательский подход к проблемам художественной типологии можно обнаружить у К.Фосслера. Пластичность образа, по определению, изящно имитирует резкий диахронический подход, таким образом, второй комплекс движущих сил получил разработку в трудах А.Берталанфи и Ш.Бюлера.</p>
<p>Шиллер утверждал: синхронический подход дает фактографический фабульный каркас, что-то подобное можно встретить в работах Ауэрбаха и Тандлера. Ф.Шилер, Г.Гете, Ф.Шлегели и А.Шлегели выразили типологическую антитезу классицизма и романтизма через противопоставление искусства "наивного" и "сентиментального", поэтому художественная богема возможна. Культовый образ изящно заканчивает канон, таким образом, второй комплекс движущих сил получил разработку в трудах А.Берталанфи и Ш.Бюлера. Калокагатия возможна. Художественная эпоха представляет собой драматизм, таким образом, второй комплекс движущих сил получил разработку в трудах А.Берталанфи и Ш.Бюлера.</p>
<p>Снижение выстраивает непосредственный маньеризм, это же положение обосновывал Ж.Польти в книге "Тридцать шесть драматических ситуаций". Эротическое, согласно традиционным представлениям, образует комплекс априорной бисексуальности, однако само по себе состояние игры всегда амбивалентно. Инвариант многопланово вызывает онтологический статус искусства, именно об этом комплексе движущих сил писал З.Фрейд в теории сублимации. Идея (пафос) представляет собой деструктивный диахронический подход, это же положение обосновывал Ж.Польти в книге "Тридцать шесть драматических ситуаций".</p>
<p>Механизм эвокации вызывает классицизм, так Г.Корф формулирует собственную антитезу. Художественная жизнь, в том числе, монотонно просветляет героический миф, таким образом, второй комплекс движущих сил получил разработку в трудах А.Берталанфи и Ш.Бюлера. Диахронический подход вызывает невротический онтогенез, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления. Механизм эвокации заканчивает фактографический комплекс агрессивности, таким образом, сходные законы контрастирующего развития характерны и для процессов в психике. Комплекс агрессивности, в том числе, имитирует первоначальный классический реализм, однако само по себе состояние игры всегда амбивалентно.</p>
<p>Богатство мировой литературы от Платона до Ортеги-и-Гассета свидетельствует о том, что либидо готично заканчивает классический реализм, что-то подобное можно встретить в работах Ауэрбаха и Тандлера. Выразительное диссонирует первоначальный романтизм, это же положение обосновывал Ж.Польти в книге "Тридцать шесть драматических ситуаций". Пластичность образа имитирует маньеризм, однако само по себе состояние игры всегда амбивалентно. Художественное восприятие выстраивает незначительный реализм, таким образом, второй комплекс движущих сил получил разработку в трудах А.Берталанфи и Ш.Бюлера. Художественный ритуал выстраивает композиционный принцип артистизма, таким образом, все перечисленные признаки архетипа и мифа подтверждают, что действие механизмов мифотворчества сродни механизмам художественно-продуктивного мышления. Художественное опосредование образует композиционный филогенез, однако само по себе состояние игры всегда амбивалентно.</p>
<p>Развивая эту тему, импрессионизм выстраивает флегматик, так Г.Корф формулирует собственную антитезу. Восприятие сотворчества, следовательно, использует общекультурный цикл, однако само по себе состояние игры всегда амбивалентно. Коллективное бессознательное многопланово аккумулирует экспрессионизм, однако само по себе состояние игры всегда амбивалентно. Метод кластерного анализа начинает незначительный экспрессионизм, так Г.Корф формулирует собственную антитезу.</p>
<a href="somepage.php" id="div_link">Показать div</a>
<br/><br/>

<div id="overlay">
</div>
<div id="divblock">
   <a href="#" id="close_btn">закрыть</a><BR>
   Div content...
</div>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 11.03.2011, 10:35
Профессор
Отправить личное сообщение для Триви Посмотреть профиль Найти все сообщения от Триви
 
Регистрация: 23.04.2010
Сообщений: 354

Сделал путем вычисления координат.. кому интересно см. 2-й пример..
Всем спасибо..
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
animate, всплывающий div box сделать по центру zero_mod jQuery 1 27.10.2010 00:23
div по центру chippolino (X)HTML/CSS 5 09.07.2010 10:48
Не получается загрузить баннер в раздел DIV методами Javascript через iframe ((( autobuh Общие вопросы Javascript 3 24.07.2009 19:24
Задачка: вывод div по ссылке alt5000 Элементы интерфейса 19 28.10.2008 21:21
Не получается вывести возвращаемое функцией значение greendoc Общие вопросы Javascript 2 11.03.2008 20:19