Как узнать размер попапа
Как узнать размер попапа
Здраствуйте!
Что-то не могу разобраться, так узнать высоту и ширину попапа? Всё пересмотрел, может плохо смотрел? Подскажите плиз!
← →
clickmaker © ( 2005-10-20 17:16 ) [1]
Да PopUpMenu! Спасибо! Ща попробую!
Что-то маленько не могу разобраться с параметрами команды GetMenuItemRect, а хелпа нет. То, что сделал выдаёт черезчёр огромные цифры, подскажите плиз
Как ни пытаюсь, даёт противоречивые результаты, то в одной последовательности 0, то в другой последовательности очень большую цифру, подскажите плиз, (Почитал на мсдне)
Понял примерно так:
GetMenuItemRect(0,(Необходимо указать хендл менюхи, указываю большое число, аказываю хендл наследника итема даёт 0),0,Rec);
В чём я не прав?
Подскажите плиз?
Просто маленький пример!
Ща попробую левую менюху сделать
Сделал даже на клик кнопки другго нового попапа, всё-равно 0/0
Это уже становиться интересным:) В чём может быть проблема?
За пример спасибо!
← →
Loginov Dmitry © ( 2005-10-21 09:54 ) [11]
Для TMainMemu функция GetMenuItemRect работает как надо, а для TPopupMenu нужно предварительно вызвать метод Popup и выбрать самому к.-л. пункт меню. Вот так.
Хм, чем дальше в лес, тем больше бутерброды. Ох уж этот масдай со своими заморочками. Сенкс! Буду рыть.
Спасибо, вм ребята. Это всё пригодиться, но до меня только что дошло, что есть путь проще Я юзаю TreeView, и у него есть такое свойство как попап, но у меня попап динамический (В зависимости от пункта) и я подумал, что событие ContextPopup с попапом раздельны (Не связаны). Но к большому счастью это не там. Так, что пускай лучше сам маздай всё считает. Спасибо ещё раз. Рецепт пригодиться в любом случае.
Проверить параметры попапа при ширине окна браузера 1600 px и 1000 px
Подскажите кто знает как решить тест кейс.
Кейс 9. Попап создания метки подстраивается под ширину экрана.
Предусловие: Пользователь авторизован. Открыта папка Входящие.
Шаг 1: В левой колонке нажать на кнопку Создать метку.
Ожидание: Открывается попап создания метки.
Шаг 2: Проверить параметры попапа при ширине окна браузера 1600 px и 1000 px.
Ожидание:
При ширине окна браузера 1600 px – ширина попапа 432 px, высота 295.2.
При ширине окна браузера 1000 px – ширина попапа 310 px, высота 212.
Container-fluid не резинит по ширине браузера при 958px и меньше
container-fluid не резинит по ширине браузера при 958px и меньше. Как эту проблему решить?
Исключение переполнения стека при минимизации окна при реагировании на параметры запуска
Вот собственно в чем и дело. При запуске программы с нужным мне параметром для минимизации окна с.
Как сделать высоту равной ширине при ширине 100%?
как можно сделать элемент(например таблицу) квадратным, т.е. высота равна ширине(ширина 100%)
Адаптивность при уменьшении окна браузера
Я сверстал карточку товара, и в задании от меня требуют: · Сама карточка (прямоугольник с.
Действия при закрытии окна браузера
Интересует можно ли когда пользователь закрывает браузер или вкладку сайта выполнить запрос в базу.
Отступы при уменьшении окна браузера
Сделал небольшие отступы главного блока css. Можно ли чтобы при уменьшении окна эти отступы.
Как узнать ширину окна браузера?
Каким инструментом лучше пользоваться, чтобы определить/задать ширину экрана браузера?
Ситуация: нужно посмотреть, как выглядит страница при ширине экрана 1024 px (вместе с прокруткой)
Правильно я понимаю, что использование Window Resizer + контроль на whatsmy.browsersize.com позволит мне точно контролировать ширину браузера?
Или вообще есть какие-то более элементарные пути? Простите, туплю (
PS Да, я искала обсуждение аналогичного вопроса на форуме и не нашла
Просто один из вариантов. Возможно не ваш.
* появится возможность выбора разрешения или устройства
Так в частности «адаптивную верстку» проверяют
facebook (Дети диаграммы Ганта)
Каким инструментом лучше пользоваться, чтобы определить/задать ширину экрана браузера?
Ситуация: нужно посмотреть, как выглядит страница при ширине экрана 1024 px (вместе с прокруткой)
Правильно я понимаю, что использование Window Resizer + контроль на whatsmy.browsersize.com позволит мне точно контролировать ширину браузера?
Или вообще есть какие-то более элементарные пути? Простите, туплю (
PS Да, я искала обсуждение аналогичного вопроса на форуме и не нашла
Посмотрел данные сайты. Очевидно они показывают размеры окна браузера без элементов интерфейса (полосы прокруток, меню). Поэтому если вам нужен размер с полосой прокрутки, то все верно. Тем более, вряд ли несколько пикселей сыграют большую роль.
Модальные окна на CSS
В наше время для различных сайтов нормой стали всевозможные всплывающие модальные окна — popup’ы — для регистрации, авторизации, информационные окна, — всевозможных форм и размеров. Также существует огромное количество плагинов к тому же jQuery для простого и удобного создания таких попапов — тот же Shadowbox, например.
Внешний вид, размеры и оформление таких попапов совершенно разнообразными — с оверлеем, тенюшками, анимациями — всего не счесть. Объединяет их только, пожалуй, тот факт, что обычно они выводятся в самом центре страницы — как по горизонтали, так и по вертикали. И центрирование это производится средствами JS. Я не буду вдаваться в подробности этих расчетов, опишу их лишь вкратце:
HTML-код попапа обычно имеет такую структуру:
И CSS (здесь и ниже я умышленно буду опускать написание некоторых свойств, необходимых лишь для некоторых браузеров и их версий, оставив лишь самое основное):
Я по натуре своей перфекционист (знаю, порой это плохо), и частенько заморачиваюсь даже над мелкими деталями, пытаясь улучшить и добавить максимально возможную расширяемость этим деталям, и меня не мог не зацепить именно этот момент в работе всех этих плагинов. Возникла мысль, что всю работу по позиционированию попапа можно переложить с плеч JS на плечи самого браузера, то есть выполнять эту работу средствами CSS.
Ниже я приведу пример попапа, работающего во всех мажорных версиях основных браузеров. Для корректной его работы в IE div class =»popup__overlay»>
div class =»popup»> div >
div >
.popup__overlay <
position : fixed ;
left : 0 ;
top : 0 ;
width : 100% ;
height : 100% ;
z-index : 999
>
.popup <
>
Фиксированные размеры
Самый простой вариант. Ничего нового изобретать не нужно:
Отрицательные margin’ы в половину ширины и высоты — банально и скучно, ничего оригинального в этом нет. Идём дальше.
Размеры попапа зависят от содержимого
Сперва — выравнивание по горизонтали — это вроде бы проще. Если попап фиксированной ширины — то достаточно будет следующего:
На вертикальное выравнивание это никак не повлияет, и, к слову, если вам достаточно лишь горизонтального выравнивания, то на этом можно и остановиться, указав еще какой-нибудь верхний отступ попапа. Но нам этого мало! Идём дальше.
Вертикальное выравнивание. Здесь уже становится интересно. С такой задачей, конечно, без проблем справилась бы таблица или эмуляция таблицы с помощью display: table & display: table-cell, но заставить такое работать в старых IE — себе дороже. Таблица также отпадает — по понятным причинам.
Итак, margin уже отпадает — размеров мы не знаем. Вспоминаем, что же есть из свойств с подобными эффектами. Ага, text-align. Но только для инлайновых элементов. ОК. Кажется, сам Бог велел использовать display: inline-block — блочный элемент, к которому можно было бы применить свойства для инлайновых элементов. С поддержкой этого свойства у всех браузеров тоже всё, можно сказать, в порядке. Код становится примерно таким:
Остаётся вертикальное выравнивание — нам подойдёт vertical-align. В любой другой ситуации было бы также уместно использовать line-height, но поскольку у нас нет фиксированной высоты страницы (line-height в данном контексте), здесь использовать её нельзя. На помощь приходит один трюк с вертикальным выравниванием элементов неизвестных размеров. Я точно помню, что нашел этот способ на Хабре, но, к сожалению, не смог найти ссылку на тот топик. Заключается этот способ в следующем: добавляется inline-block элемент нулевой ширины и 100%-ой высоты родителя, который «расхлопывает» высоту строки до 100% высоты родителя, то есть до высоты рабочей области страницы. Сделаем это изящнее — вместо лишней разметки воспользуемся псевдоэлементами:
Осталось добавить полупрозрачное затемнение оверлея — с этим справится rgba. Всё! Теперь положение попапа регулируется только средствами браузера на уровне CSS.
Из замеченных минусов метода — порой возникают глюки с отображением в IE 6-7, в частности, при использовании флоатов.
Повторюсь — мой метод не избавляет от использования JS вообще, он лишь частично оптимизирует скорость работы всплывающих окон за счет переноса части нагрузки с JS на CSS.
Уверен, что метод можно улучшить — как визуально, так и изнутри, и буду рад любым идеям и предложениям по этому поводу, а также замечаниям по работе и отображению в различных браузерах.
Способы создания окон PopUp
Введение
В данном уроке я не открою тайну для матерых верстальщиков и гуру css, но данная статья будет полезна начинающим. именно здесь вы сможете узнать, как создавать всплывающие окна поверх всего сайта.
Чаще всего такие окна появляются после совершения определенных действий на сайте, например, пользователь нажимает на ссылку «Заказать обратный звонок» и перед ним всплывает форма заказа.
Очень удобно использовать PopUp окна в связке с ajax, но это уже тема другого урока.
Всё больше и больше в сети начинает появляться веб-ресурсов, которые используют всплывающие окна PopUp. В пример можно привести всем знакомые социальные сети. Все лишние данные со скриншотов удалены.
Вконтакте
Думаю достаточно доводов, чтобы начать изучать вопрос: как же сделать на своем сайте всплывающее окно PopUp.
Постановка задачи(ТЗ)
Необходимо создать поверх всего сайта всплывающее окно с затемнением экрана.
Решение
Способ 1
Результат:
Очень часто предлагают использовать:
Да, результат получается аналогичный, но из-за того, что у нас задана высота блока «затемнения», появляются полосы прокрутки. Именно поэтому такой метод не подходит.
Способ 2
Этот способ не отличается кардинально от Способа 1, но я считаю его более удобным.
Html (без изменений)
Результат аналогичный
Благодаря свойству: min-height:100%; наш блок «затемнение» обрел ширину в 100% и минимальную высоту в 100% экрана.
Единственным минусом данного способа является то, что Internet Explorer поддерживает данное свойство только с версии 8.0.
Добавление магии на Jquery
Теперь добавим ссылки для скрытия/отображение нашего всплывающего окна.
Для этого необходимо подключить библиотеку JQuery и небольшой скрипт:
Также необходимо обновить Html:
Результат
Теперь при загрузке страницы всплывающее окно PopUp скроется.
Если мы нажмем на ссылку «Show popup», у нас появится всплывающее окно. А если нажать на ссылку «Hide popup», то всплывающее окно вновь скроется.