Как увеличить картинку при нажатии в html или css?

Question

[Jony1337]

Привет народ
Стало интересно как сделать так чтобы при нажатии на картинку она увеличивалась и фон стал черным или что то как у facebook или vk.com вот примерно как нужно prntscr.com/azilq1 дайте совет может есть готовое решение

Answer 1

[Андрей Федоров]

Легко. Изучайте...
codepen.io/aliencash/pen/EPwLMg

Хотя конечно calc() это не совсем верный подход. Но на флексы можете сами переделать... Главное общий принцип иллюстрирует.

Comments

[Jony1337]

тут нужны 2 фотки или 1 ?

[Андрей Федоров]

Одна, большая.

[Jony1337]

имею в виду что нужна 1 большая и 1 маленькая или нет

[Jony1337]

Андрей Федоров: ок

Answer 2

[Карина]

тебе нужен fancybox.
Вот очень простая библиотека
fancyapps.com/fancybox

Answer 3

[Александр]

https://github.com/humaan/Modaal Лучше fancybox, больше функций.

Answer 4

[51oma]

Можно сделать на чистом JavaScript, например, с помощью библиотеки highslide.js. Как ее внедрить можно посмотреть на официальном сайте (на английском) или тут (на русском)