Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.03.2010, 10:45
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Как здесь устроено "к странице"?
Как здесь устроено "к странице"?

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

Подскажите, пожалуйста, как сделано так, что это окно появляется точно под кнопкой?

Само окно представляет из себя div-объект.

<div style="position: absolute; z-index: 50; clip: rect(auto, auto, auto, auto); left: 1075px; top: 509px;" id="pagenav_menu" class="vbmenu_popup"> ...	</div>


Как здесь вычислено "left: 1075px" и "top: 509px" ? Потому, что они зависят от размера шрифта размера окна браузера, и прочих параметров.

Такую кнопку с выпадающим меню вообще можно сделать на голом html, или обязательно должен быть javascript?
Ответить с цитированием
  #2 (permalink)  
Старый 04.03.2010, 10:49
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Тоже самое, что и "к странице", здесь ещё и "опции темы" и "искать в теме".
Ответить с цитированием
  #3 (permalink)  
Старый 04.03.2010, 12:03
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Бобр
Как здесь вычислено "left: 1075px" и "top: 509px" ?
http://javascript.ru/ui/offset
Ответить с цитированием
  #4 (permalink)  
Старый 04.03.2010, 12:25
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Сообщение от Kolyaj Посмотреть сообщение
http://javascript.ru/ui/offset
А как ЗДЕСЬ устроено?
Ответить с цитированием
  #5 (permalink)  
Старый 04.03.2010, 12:27
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Что именно вам непонятно?
Ответить с цитированием
  #6 (permalink)  
Старый 04.03.2010, 12:51
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Сообщение от Kolyaj Посмотреть сообщение
Что именно вам непонятно?
Непонятно как выглядит жаваскрипт-код, который здесь это делает.
Непонятно можно ли это сделать без javascript? Указать что-нибудь типа "position: relative;", только не relative, а чтобы div был поверх остальной страницы.
Ответить с цитированием
  #7 (permalink)  
Старый 04.03.2010, 13:08
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Бобр
Непонятно как выглядит жаваскрипт-код, который здесь это делает.
Какая разница, как именно здесь это делается? Посмотрите исходники, если это так интересно.

Сообщение от Бобр
Непонятно можно ли это сделать без javascript?
Иногда можно. Контейнеру ставите position: relative, дочерние элементы с position: absolute будут позиционироваться относительно этого контейнера.
Ответить с цитированием
  #8 (permalink)  
Старый 04.03.2010, 13:26
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Сообщение от Kolyaj Посмотреть сообщение
Какая разница, как именно здесь это делается?
Чтобы я мог просто скопировать нужный кусок кода и вставить себе.


Сообщение от Kolyaj Посмотреть сообщение
Посмотрите исходники, если это так интересно.
Я не нашёл где именно там.


Сообщение от Kolyaj Посмотреть сообщение
Иногда можно. Контейнеру ставите position: relative, дочерние элементы с position: absolute будут позиционироваться относительно этого контейнера.
Немного помогло.
А как теперь сделать, чтобы div появлялся под кнопкой, а не поверх неё?
Ответить с цитированием
  #9 (permalink)  
Старый 04.03.2010, 13:35
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Бобр
Чтобы я мог просто скопировать нужный кусок кода и вставить себе.
Это не всегда возможно.

Сообщение от Бобр
А как теперь сделать, чтобы div появлялся под кнопкой, а не поверх неё?
top/left
Ответить с цитированием
  #10 (permalink)  
Старый 04.03.2010, 15:00
Кандидат Javascript-наук
Отправить личное сообщение для Бобр Посмотреть профиль Найти все сообщения от Бобр
 
Регистрация: 03.11.2008
Сообщений: 116

Спасибо!

Сделал так:

<SCRIPT type=text/javascript>
  function toggleB(e){e.style.display=(e.style.display!='block')?'block':'none'}
</SCRIPT>


<style type=text/css><!--
#wind {
  position: absolute;
  width:320px;
  left: 0px;
  top: 4px;
  border:solid #105a98 1px;
  display: none;
  background-color:#FFFFFF;
  color:#000000;
  padding:10px;
}
//--></style>

  <span style='position:relative'><div id="wind">
     Всплывающее окно
  </div></span>
  <a href="#" onclick="toggleB(document.getElementById('wind'));return false;"
  >Открыть окно</a>


При изменении размера шрифта, окно остаётся на месте, в отличии от окна "к странице", которое используется здесь.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Открытие div блока при первом визите на сайт Nushaba Общие вопросы Javascript 28 20.12.2013 20:24
Как организовать RichEdit arma Элементы интерфейса 2 18.02.2010 14:57
О наследовании событий, или как корректно его отменить. JCShen Events/DOM/Window 8 09.02.2010 00:00
Как правильно послать XML в POST запросе LowCoder AJAX и COMET 10 15.07.2009 23:20