Как сделать галерею?

Question

[asyasb]

https://codepen.io/ggknjkb/pen/vYGVryy
как сделать так, чтобы все фотографии увеличивались при нажатии и появлялись стрелочки и крестик

Comments

[Максим]

обычная галерея - их множество в сети

[asyasb]

Много Чего, знаю, пробовала 4 варианта, все открывают картинку и всё (закрыть не могу, листать не могу)

[Максим]

asyasb, вы если хотите то давайте вместе - я буду на вашем компе делать при вас - согласны ?

[asyasb]

Много Чего, это сарказм?

[Максим]

asyasb, почему сарказм - я предлагаю свою помощь бесплатно - в своё время мне ни кто и ни когда такое не предлагал

[asyasb]

Много Чего, спасибо за предложение, просто звучит странно

[Максим]

asyasb, в личке есть email - пишите если надумаете

[Роман]

asyasb, а можно я тоже на вашем компе бесплатно поковыряюсь, мне ботнет расширять надо)))

[asyasb]

Роман, спасибо за объяснение ))

[Steppp]

Автор, извини, но этот вопрос задаю те, кто не умеет верстать((( На такую верстку смотреть, больно(

[Роман]

спасибо за объяснение ))

asyasb, это шутка была, так свои ботнеты расширяют только полные профаны))))

[asyasb]

Steppp, а я и не говорила, что умею верстать. я знаю, что там ужас, а не код, но сделать лучше не могу

[asyasb]

Роман, а это был сарказм

[Steppp]

asyasb, Понятно asyasb) Ох и сложно тебе будет( На гугли галерея слайдер js, подбери подходящую)
Да, и пропиши в html всем тегам классы, будет удобнее.
В тегах

<img src="с201611.jpg" height="300px" width="450px" align="center" />
надо так
height="300" width="450"  иначе не работают

+ у тебя там не разрывные пробелы есть. Зачем??? Ведь есть margin-left: 10px; или padding-left: 10px;

[Steppp]

И скажешь по секрету, как ты искала неразрывный пробел?   Я его не мог найти, мне margin padding поиск выдавал)

[asyasb]

Steppp, там для каждого свое количество, а с margin и padding очень долго прописывать для каждого, за остальное спасибо

[Максим]

Steppp, вроде есть htmlbook.ru/samhtml/tekst/spetssimvoly

[Максим]

asyasb, зря отказалась - но помог бы и научил бы что бы красиво - что бы не стыдно было и что бы хоть на выставку

[Steppp]

asyasb, А пробел для каждого не долго ставить?))) Пишешь название классов

<img class="image">
<img class="image">
<img class="image">

<ul class="list">
  <li class="item">
    <a class="link" hreff="#">
  </li>
</ul>
.image {
  height: 300px;
  width: 450px;
}
.list { стили для <ul> }
.item { стили для <li> }
.link { стили для <a> }

Может и дольше, но если у фотографий тебе надо поменять ширину, ты у всех будешь менять, а так поменяла в 1 месте

Answer 1

[Никита Михайлов]

Можно использовать готовые плагины fancyapps.com/fancybox/3