• Страница 1 из 1
  • 1
Модератор форума: -SAM-  
Форум » Веб-разработка » Вопросы по uCoz » Как поставить изображение друг к другу на сайте (Как выстроить изображение в 2 или 4 ряда на сайте)
Как поставить изображение друг к другу на сайте
F1z140K
Дата: Понедельник, 2020-04-20, 18:13 | Сообщение 1
Оффлайн
Проверенные
Сообщений:47
Награды: 0


Блин сижу не могу понять в чем проблема. Кароче закидываю много картинок и они тупо в ряд становятся и открываются на другой вкладке.
Хотя до этого дано добалял материал картинки сжаты друг к другу и открываются увеличением при нажатии, хотя вроде скрипт прописан.

Тут плохо стоят:


Тут хорошо:


Я так понимаю это как раз и отвечает за него.

Код
<?if($IMGS_ARRAY_JS$)?>
$IMGS_ARRAY_JS$
<div id="img$ID$"></div>
<script type="text/javascript">
var html='';
for(i in allEntImgs$ID$) {
var aImg=allEntImgs$ID$[i];
html+=(aImg[3] && aImg[3].length>0 ? ' <a href="'+aImg[0]+'" target="_blank"><img width="250" src="'+aImg[3]+'" border="0"/></a><br><br>' : ' <img src="'+aImg[0]+'" border="0"/>');
}
document.getElementById('img$ID$').innerHTML=html;
</script>
<?endif?>
Страна: (RU)
Kosten
Дата: Понедельник, 2020-04-20, 19:25 | Сообщение 2
Оффлайн
Администраторы
Сообщений:29163
Награды: 62


F1z140K, по идее нужно выставить этот стиль в самый вверх, и далее настраивать, пока сильно не смотрел, край времени.

Код
@import url(http://www.aonline.ucoz.ru/css/other.css);
[id="img141"] img {
float: left;
max-width: 32%;
max-height: 200px;
display: block;
padding: 3px;
}
[id="img140"] br {display:none;}
.viewn_mess2 {display: inline-grid;}
Страна: (RU)
Snoopak
Дата: Понедельник, 2020-04-20, 19:39 | Сообщение 3
Оффлайн
Проверенные
Сообщений:48
Награды: 2


F1z140K, Все очень просто, у Вас стиль привязан к id div#img140 в который выводятся изображения, но 140 это ID материала, а значит на материалах с других ID стиль не применяется. Но все можно поправить, для этого в CSS замените
Код
[id="img140"] img {
float: left;
max-width: 32%;
max-height: 200px;
display: block;
padding: 2px;
}
[id="img140"] br {display:none;}

На:
Код
.viewn_mess2 div[id^="img"] img {
float: left;
max-width: 32%;
max-height: 200px;
display: block;
padding: 2px;
}
.viewn_mess2 div[id^="img"] br {display:none;}
Ну или можно на для того блока добавить какой-то класс и уже для него прописать стили.


Страна: (UA)
F1z140K
Дата: Понедельник, 2020-04-20, 19:52 | Сообщение 4
Оффлайн
Проверенные
Сообщений:47
Награды: 0


Snoopak, ХМ... Поменял , все так же осталось
Страна: (RU)
FeStemBer
Дата: Понедельник, 2020-04-20, 19:57 | Сообщение 5
Оффлайн
Проверенные
Сообщений:350
Награды: 1


F1z140K, попробуй почистить кэш браузера.
Страна: (RU)
Snoopak
Дата: Понедельник, 2020-04-20, 20:04 | Сообщение 6
Оффлайн
Проверенные
Сообщений:48
Награды: 2


F1z140K, Ctrl+F5 дабы обновить кэш страницы.

Страна: (UA)
F1z140K
Дата: Понедельник, 2020-04-20, 20:05 | Сообщение 7
Оффлайн
Проверенные
Сообщений:47
Награды: 0


Snoopak, Он их сделал ровными, но почему в одном материале при нажатии картинки они увеличиваются, а в новом файле перекидывает в отдельном окне ?
Страна: (RU)
Snoopak
Дата: Понедельник, 2020-04-20, 20:09 | Сообщение 8
Оффлайн
Проверенные
Сообщений:48
Награды: 2


F1z140K, Потому что не прописано для ссылки class="ulightbox" data-fancybox-group="ultbx". Для этого нужно в скрипте заменить
Код
<a href="'+aImg[0]+'" target="_blank">
На
Код
<a href="'+aImg[0]+'" target="_blank" class="ulightbox" data-fancybox-group="ultbx">


Страна: (UA)
F1z140K
Дата: Понедельник, 2020-04-20, 20:12 | Сообщение 9
Оффлайн
Проверенные
Сообщений:47
Награды: 0


Snoopak, О наконец-то! Спасибо большое!
Страна: (RU)
Форум » Веб-разработка » Вопросы по uCoz » Как поставить изображение друг к другу на сайте (Как выстроить изображение в 2 или 4 ряда на сайте)
  • Страница 1 из 1
  • 1
Поиск: