Прехвърляне на прозорец на HTML5, CSS3 и скрити отметки
Прехвърляне на прозорец на HTML5, CSS3 и скрити отметки
При образуването рамка на прозореца HTML-модален ръководят от принципите за изграждане на стандартни HTML-страници, т.е. прозореца ни се състои от основа на контейнера
HTML рамка
Наред със стандартните елементи HTML тагове и
модален обвивка .modal-наслагване
Ако не се нуждаете от някой от разделите, например не е необходимо в заглавието, можете да изключите
Много, много, използвайте модални прозорци, за да покажат различни изображения, така че при условие, както и тази опция. Снимки, вградени в тялото на ширина прозорец помолени 100% макс ширина: 100%;. определяне на височината за автоматично височина: автоматично. с които да се показват изображения правилно, когато промените размера на прозореца в една посока или в другата посока, оказва се, така че това е адаптивност)).
За да получите лайтбоксът на действие, когато изображението изпълва цялото пространство от изскачащия устройството, извадете достатъчно Разделение хедър, долната единица с бутона и задайте необходимата подложка вътре модален прозорец, в селектор .modal-тяло.
Това е всичко! Остава само да си припомним, че този метод ще работи добре само в съвременни браузъри, безусловно подкрепа свойства на CSS3, който е едновременно само му недостатък.
-Задълбочено в кода тук.
В заключение още веднъж погледнете демото и ако е необходимо, за по-подробен анализ, изтеглите изходния код, аз внимателно опакован в архив, и си сложи Yandex.Disk:
Всичко ще бъде благодарен, ако подкрепа за проекта - добавяне на блог, за да AdBlock изключения и да споделите връзка към запис в своите социални мрежи: