Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Дилоги jquery (https://javascript.ru/forum/xhtml-html-css/7302-dilogi-jquery.html)

mycoding 25.01.2010 20:33

Дилоги jquery
 
Ребята, конечно это наверное слишком нагло, но вот хочется попросить.
Может ли кто-нибудь рассказать, как делать точно такие же диалоги как
в jquery? Интересует только css. Пробовал разбирать диалоги
jquery, через Firebug столько параметров, что не поймешь, что за какой отвечает, почему не срабатывает.
Например не получается по нормальному , разместить в одной линии,
TITLE текст и закрывающую кнопку. Уже вроде разобрался оказывается элемент div каждый последующий
вложенный размещается на новой строчке, а элемент span остаётся на той же линие.

Так же к заметил, что вот это
position:absolute;
right:0;

и вот это
position:relative;
right:0;


Рабатает несколько не так как от них ожидалось. Если написано absolute, то должно задаваться относительно
самого браузера, т.е. в первом примере, элемент должен быть размещён с права в браузере толи в углу, толи где то по середине, (вне зависимости , где он вложен).
На практике он расположен справа внутри элемента.
А второй вариант вообще не срабатывает ????? Хотя он как раз должне работать , как в это ситуации почему то работате первый вариант.


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


Вот ещё один вопрос
background:#CCCCCC url(titleBar_1x100.png) repeat-x scroll 50% 50%;

Что означает scroll 50% 50% ?

PeaceCoder 25.01.2010 21:29

Цитата:

Сообщение от mycoding
(вне зависимости , где он вложен).

вот тут ошибка.
если родитель имеет position != static то элемент с position = absolute||relative позиционируется относительно родителя.
чтобы независимо от родителя и документа, а относительно окна position = fixed

mycoding 25.01.2010 21:59

Как я понял fixed вроде,не меняет своё положение даже если пролистовается окно скролом, а это уже не то.

Ну это ладно, не получается теперь вот что
Там есть кнопка закрытия, код которой приблизительно такой
<div class="">
<span class="" id="">Basic dialog</span>
<a class="" >
<span class="">close</span>
</a>
</div>


Ка понял, ссылка a нужна только затем, чтобы менялся курсор при наведекнии, и при нажатии что-то происходило.
но Вот в нём span? в который вставлена close. Как понял пустой span
без текста показывать ничего не будет в отличее , если бы тоже самое сделать в див, и вопрос как от этого close Избавится, чтобы браузер его не показывал?

С этим вроде разобрался там есть параметр text-identity, который сдвигает текст , его надо становить
text-indent:-999999px;

Но иногда, ещё что-то подправить...

Теперь в мозиле отображает правильно, а в IE 6 , изображение закрытия сьзжает на серидину диалога
задан параметр
top:50%;

Он должен отображать по середине внутри блока , а он отображает по середине, всего диалога.........

Octane 26.01.2010 00:55

Без умения верстать, лезть в UI-разработку — гиблое дело. Учись верстать: http://javascript.ru/forum/xhtml-htm...o-vertske.html

micscr 26.01.2010 09:10

fixed в ie6 не работает, так что отставить

Цитата:

background:#CCCCCC url(titleBar_1x100.png) repeat-x scroll 50% 50%;
Зачем скролл не пойму, а вот 50% 50% задает откуда начнет размножаться фон. Причем тут хитро - это не отступ а точка совмещения. Подробнее гугли.

mycoding 26.01.2010 16:12

Ещё вопрос, но это уже js вопрос, как на кнопку закрытия устанавливается событие нажатия и наведения? Если наведения может быть через css, что вряд ли по коду не похоже, то нажатие вообще не понятно. Дело в том что обработчика в самом элементе нет,
и id ни у ссылки нет ни у span. значит где-то внутри кода с помощью чего?
Ведь id по любому нужен тогда???

PeaceCoder 26.01.2010 16:16

код может быть в глубине родителей вылавливать на чем происходит событие и изменять соответсвенно. оч хороший способ не навешивать кучу обработчиков. + если навешивается с помошью attachEvent||addEventListener то вы вообще не найдете что именно обрабатывает событие. Только если дебажить весь код.

mycoding 26.01.2010 21:17

Вопрос опять не по css, хотя может и по css.
Если не сложно подскажите, пожалуйста.
Вот получается делаю диалог, как в jquery, т.е. сначала определён
див либо с текстом внутри либо без текста. Когда запущен диалог, он полностью сформирован. Если его надо закрыть, то просваиваю свойству
display значение none. Но если его опять надо открыть, внутрь добавляется опять тоже самое, что забито по стандарту.
И получается, что диалог содержит, уже второе вложение, всяких кнопок и прочего. И вот вопрос как от этого избавится.

1. Если стирать всё что есть в диалоге, то получается, теряется текст который там возможно был определён с самого начала. Т.е. этот вариант не подходит.
2. Как-то надо определить, что диалог уже был запущен, и присвоить
display значение block.
Вот вопрос как узнать, что диалог уже был запущен ?????

mycoding 28.01.2010 20:45

Вот, что получилось конечно ещё надо доделать, но все же http://js-coding.narod.ru Но вот что не пойму, почему во всех браузерах, кроме IE 6 вcе работает отлично, а в IE, при наведении на кнопку закрытия, она смещается. Вообще там в свойствах, должно стоять
top:50% но из-за того что ie смещает сразу на середину диалога кнопку пришлось, указать явно смещение.

mycoding 30.01.2010 14:40

Получилось добавить изменение размера, но в IE пока не работает.
И почему то при изменении размера появляются как сколы на верней грани.
http://js-coding.narod.ru


Часовой пояс GMT +3, время: 01:58.