Новости Joomla

Joomla по-русски — возвращение к истокам

Joomla по-русски — возвращение к истокам

С 1 марта 2026 года наш проект меняет название. Joomla Russia становится Joomla по-русски.

Это давно напрашивалось, со времён редизайна сайта, но тут подвернулся повод.

Поводом послужили новые требования российского законодательства об использовании русскоязычных наименований для отечественных проектов. Но мы воспринимаем это не как обязанность, а как хороший толчок сделать то, о чём думали и раньше.

Joomla по-русски — для всех, кто творит сайты на великом и могучем.

👩‍💻 WT Layout select - плагин выбора файла макета (layout) Joomla.

👩‍💻 WT Layout select - плагин выбора файла макета (layout) Joomla.

Плагин пользовательского поля Joomla: выпадающий список PHP-лейаутов из указанных папок с учетом переопределений активного шаблона сайта.

👩‍💻 Extended Wishlist для JoomShopping 5+.

👩‍💻 Extended Wishlist для JoomShopping 5+.

Extended Wishlist — полностью переработанный список избранных товаров для JoomShopping 5+, значительно удобнее стандартного решения и расширяет его функциональность. Работает через AJAX, быстро и без перезагрузки страниц, обеспечивая современный UX.
- Мгновенная работа на AJAX
- Поддержка авторизованных и гостей
- Иконка добавления везде
- Добавление товаров без ограничений по атрибутам
- Wishlist прямо в корзине и при оформлении
- Собственные шаблоны и кастомизация
- Модуль количества избранного

Страница расширения

@joomlafeed

1   Вниз
0 Пользователей и 1 Гость просматривают эту тему.
  • 8 Ответов
  • 2327 Просмотров
*

slepoy

  • Давно я тут
  • 753
  • 24 / 0
  • Тотальная шизофазия
[Решено] Выровнять несколько элементов поверх изображения
« : 07.10.2013, 03:14:36 »
Все началось с того "Как написать текст поверх изображения".
Проблемная страница: http://crimson-land.ru/games/top-down.html
С помощью этой статьи http://www.css-tricks.ru/articles/Details/TextBlocksOverImage
привел категорию к желаемому виду - поверх изображения отображается текст "скачать" с красным фоном.
Код
<div class="notice-red"><span>Скачать</span></div>
Код: css
.notice-red  {
	position: absolute;
	top: 180px;
	left: 0;
	width: 100%;}

.notice-red span {
	color: white;
	font-size:16px;
	font-weight: bold;
	background: rgb(255, 0, 0);
	background: rgba(255, 0, 0, 0.8);
	padding: 6px;}


Все замечательно до тех пор, пока не понадобилось добавить второй текст. Видно как один текст "Demo" накладывается на другой "Steam" (ну вроде логично, ведь для второго применен аналогичный стиль, но с другим фоном):



В попытках отобразить оба текста в одну строку рядом друг с другом, отредактировал CSS до следующего вида, изменив атрибут "position" и добавив "display: inline;":
Код: css
.notice-red  {
	position: relative;
	bottom: 40px;
	left: 0;
	width: 100%;
	display: inline;}

И вроде бы все хорошо, но вдруг высота блока/изображения над которым есть такие таксты стала больше, чем высоба блока, где таких текстов нет:



Далее так и не понял, в чем моя ошибка и в чем секрет "position".
На данный момент в CSS использованы стили, которые указаны в начале топика.
Благодарю за помощь.
« Последнее редактирование: 07.10.2013, 18:46:48 от slepoy »
Записан
Помог? Поставь(те) плюс в репутацию.
*

Рэм

  • Осваиваюсь на форуме
  • 18
  • 1 / 0
Re: Выровнять несколько элементов поверх изображения
« Ответ #1 : 07.10.2013, 18:13:12 »
Пробовали сделать блок с картинкой не img, а div с бакграундом этой картинки? тогда вопрос с position отпадет, так как кнопки можно поместить внутрь этого блока и уже спозиционировать как надо.
Второй вариант - тоже без position. Кнопки будут relative со сдвигом на картинку наверх top:-40px, например.
Третий вариант - js скрипт, где позиция кнопок будет зависеть от их ширины.
Четвертый - если текст на кнопках будет не динамичный, то почему бы и не выровнять с помощью margin?
Записан
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Re: Выровнять несколько элементов поверх изображения
« Ответ #2 : 07.10.2013, 18:22:46 »
Посмотрел по ссылке - проблем не увидел
Записан
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
*

slepoy

  • Давно я тут
  • 753
  • 24 / 0
  • Тотальная шизофазия
Re: Выровнять несколько элементов поверх изображения
« Ответ #3 : 07.10.2013, 18:27:33 »
Цитата: Рэм от 07.10.2013, 18:13:12
Пробовали сделать блок с картинкой не img, а div с бакграундом этой картинки? тогда вопрос с position отпадет, так как кнопки можно поместить внутрь этого блока и уже спозиционировать как надо.
К сожалению данный вариант не подходит т.к. изображение должно быть кликабельным (оно создается не com_content компонентом и глобально менять в нем вывод изображений не желателен).
Цитата: Рэм от 07.10.2013, 18:13:12
Второй вариант - тоже без position. Кнопки будут relative со сдвигом на картинку наверх top:-40px, например.
Да, так работает (как писал ниже) Но появляется отступ
Код: css
.notice-red  {
	position: relative;
	bottom: 40px;
	left: 0;
	width: 100%;
	display: inline;}


Цитата: Рэм от 07.10.2013, 18:13:12
Третий вариант - js скрипт, где позиция кнопок будет зависеть от их ширины.
Не подходит.
Цитата: Рэм от 07.10.2013, 18:13:12
Четвертый - если текст на кнопках будет не динамичный, то почему бы и не выровнять с помощью margin?
К сожалению где-то одна кнопка, а где-то две-три и хочется, чтобы всегда они были по центру.

Спасибо.
Записан
Помог? Поставь(те) плюс в репутацию.
*

slepoy

  • Давно я тут
  • 753
  • 24 / 0
  • Тотальная шизофазия
Re: Выровнять несколько элементов поверх изображения
« Ответ #4 : 07.10.2013, 18:34:16 »
Добавилось несколько статей к категории, но результат можно увидеть, если пощелкать по поганиции 1, 2, 3... http://crimson-land.ru/games/top-down.html
Возникает проблема в отступах

Записан
Помог? Поставь(те) плюс в репутацию.
*

Рэм

  • Осваиваюсь на форуме
  • 18
  • 1 / 0
Re: Выровнять несколько элементов поверх изображения
« Ответ #5 : 07.10.2013, 18:39:36 »
С помощью мазонри выкрутились, как посмотрю)
что если кнопки поместить в отдельный div , у которого будет position: absolute, сам div будет поверх изображения, а кнопки внутри него display:inline-block?
Записан
*

slepoy

  • Давно я тут
  • 753
  • 24 / 0
  • Тотальная шизофазия
RE: Выровнять несколько элементов поверх изображения
« Ответ #6 : 07.10.2013, 18:47:14 »
Спасибо большое - сработало :~]
Записан
Помог? Поставь(те) плюс в репутацию.
*

Рэм

  • Осваиваюсь на форуме
  • 18
  • 1 / 0
RE: Выровнять несколько элементов поверх изображения
« Ответ #7 : 07.10.2013, 18:48:38 »
Незачто.
Мазонри вырубить не забудь)
Записан
*

Pazys

  • Завсегдатай
  • 1738
  • 241 / 4
  • <a>А где я ошибся-то?</b>
Re: Выровнять несколько элементов поверх изображения
« Ответ #8 : 07.10.2013, 18:53:02 »
MacOS
Safari 6 - нет проблем
Firefox 23 - нет проблем
Chrome 30 - нет проблем

Причем в Chrome было, но при обновлении страницы исчезло .... видимо вы исправили

Записан
Ишак меня нюхал ...
Если помог - плюсуйте в карму.
1   Вверх
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

[Решено] Как сделать чтобы фотография открылась в отдельном окне?

Автор a-two

 Ответов: 11
Просмотров: 3088 		Последний ответ 03.11.2020, 16:57:40
от Nikolay89
[Решено] Слетает правый сайдбар на шаблоне protostar

Автор Mick_20

 Ответов: 4
Просмотров: 3158 		Последний ответ 28.05.2020, 15:45:06
от Muzzy
Позиция фонового изображения

Автор Forgiving

 Ответов: 2
Просмотров: 1368 		Последний ответ 30.03.2020, 10:58:49
от beliyadm
Несколько вопросов про шаблон (Joomla! 3.9.1)

Автор int31

 Ответов: 6
Просмотров: 2033 		Последний ответ 09.02.2020, 20:28:49
от AlexB
Как выровнять блоки в модуле?

Автор arkady

 Ответов: 4
Просмотров: 1554 		Последний ответ 14.10.2019, 23:24:14
от AlekVolsk