На товари, изскачащи прозорци, използвайки CSS3 без JavaScript

На товари, изскачащи прозорци, използвайки CSS3 без JavaScript


На товари, изскачащи прозорци, използвайки CSS3 без JavaScript

Да започнем с това, всички тези, които се интересуват от тази тема, можете да погледнете примера на работата на модалните прозорци в различни версии и изтеглите изходния код:

Не приемайте този урок като ръководство за действие, тъй като на този етап са постигнали уверен подкрепа само съвременни браузъри (IE 9+, Firefox, Safari, Opera, Chrome). С едно око на това, че древната версия на IE браузър все още е доста популярен сред потребителите се насърчават да разгледат тази статия като един вид експеримент, демонстрация CSS3 възможности.







Е, сега отидете директно на самото оформление на HTML код и стилистично оформянето на нашата модален прозорец с CSS3)))

Стъпка 1. HTML







По-долу е пример за основен HTML-маркиране изскачащи прозорци и връзки активиране:

Стъпка 2. CSS

За основа на материалите, са взети от различни източници burzhuinskih безмилостно perelopacheny, обработени и събрани в повече или по-малко подреден структура, всички ръководства по темата и аз не помня толкова.

заключение:

1. Само не влиза в m.okno таг

. Ако имате нужда от форма, поставете го в m.okno, или да направите за себе си под формата модален: виж например

2. Прозрачност на какво? Ако цветност на фона на прозрачността се регулира от най-новите цифрови стойност в имот фон-цвят: RGBA (0, 0, 0, 0.65); (Цвят модел RGBA), в този пример 0.65, опитайте да увеличите или намалите стойността и да видим резултата. В същото равнище на прозрачност се определя от свойствата на непрозрачност

Може би все пак за мен, да ми кажете специфичен прозорец желания модален, мислите, че Док най-малко това, което публикувате в прекрасно място. Необходимо е прозорец Прехвърляне да работи с PHP форма (с регистрация). Лесно и не са натоварени с ненужни код може да се затваря, без да кликвате върху бутона Затвори. Прекарвам много повече време изпълзяват във всички modalki в колекцията)

Всеки m.okno от колекцията, подходящ за настаняване на най-различни форми.

Vskidku, вижте как да се приложи стандартната форма за обратна връзка в модален прозорец, за да съборят отметката: виж например Вариант 2 се закрива, както като кликнете върху бутон или чрез кликване извън прозореца.

Както може да се възпроизвежда в модален прозорец от друг фрагмент от файла (* .txt, * .html) затворен в таговете. Аз не бих искал да се претовари index.html на файла, в който има само линкове (много връзки), за да отворите модален прозорец, съдържанието на модален прозорец, в който много текст.