Как сделать подсветку кнопок при наведении на них: новая тема, ответить, изменить и т.д.
Комментарии: 10

CabinetAdmin 01 апр 2015, 15:27 Сообщение

А подсветка в чём заключается? Если в том смысле, чтобы вокруг кнопки появлялось что-то вроде тени, то это в colours.css к .button:hover, .dropdown-visible .dropdown-select, .nojs .dropdown-container:hover .dropdown-select { добавить:

Код: Выделить всё

	box-shadow: 0 0 0 1px #FFFFFF inset, 0 0 5px #ff0000;
	-webkit-box-shadow: 0 0 0 1px #FFFFFF inset, 0 0 5px #ff0000;
#ff0000 - красный цвет появляющейся тени.
Можно ещё там же поиграть с text-shadow, например text-shadow: 1px 1px 0 #FFFFFF, 0 0 5px #ff0000;.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

skylink67 01 апр 2015, 17:48 Сообщение

да не так, а вот так: http://screen.sotmarket.ru/20150401-12q-2kb.jpg, а при наведении так: http://screen.sotmarket.ru/20150401-397-2kb.jpg
  • 0

CabinetAdmin 01 апр 2015, 20:17 Сообщение

Эти кнопки обычно выполнены в виде изображений. Вы хотите вместо изображения оформить кнопку через css?

Тогда в buttons.css в самый верх:

Код: Выделить всё

.buttons div a {
	border: 1px solid #A5A5A5;
	color: #A5A5A5;
	text-align: center;
	padding: 5px;
	border-radius: 5px;
}

.buttons div a:hover {
	border-color: #D28A28;
	text-decoration: none;
	color: #D28A28;
}

.buttons div span {
	background-image: none;
}
Это как пример.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

skylink67 01 апр 2015, 20:48 Сообщение

а как установить такие кнопки себе на форум?
  • 0

CabinetAdmin 01 апр 2015, 20:52 Сообщение

Через наборы изображений используемого стиля.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

skylink67 02 апр 2015, 02:34 Сообщение

Кнопку меняю но на форуме она не меняется, в чём может быть проблема?
  • 0
Вложения
Как сделать подсветку кнопок при на ведении? - 32.jpg
Последний раз редактировалось skylink67 02 апр 2015, 17:27, всего редактировалось 1 раз.

CabinetAdmin 02 апр 2015, 17:09 Сообщение

Чего не получается?
Картинки закидываются в imageset и в наборах изображения меняются. Плюс можно проверить наличие кода в colours.css:

Код: Выделить всё

/* Big button images */
.reply-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_REPLY_SRC}"); }
.post-icon span		{ background-image: url("{IMG_BUTTON_TOPIC_NEW_SRC}"); }
.locked-icon span	{ background-image: url("{IMG_BUTTON_TOPIC_LOCKED_SRC}"); }
.pmreply-icon span	{ background-image: url("{IMG_BUTTON_PM_REPLY_SRC}") ;}
.newpm-icon span 	{ background-image: url("{IMG_BUTTON_PM_NEW_SRC}") ;}
.forwardpm-icon span	{ background-image: url("{IMG_BUTTON_PM_FORWARD_SRC}") ;}
и в buttons.css:

Код: Выделить всё

/* Set big button dimensions */
.buttons div.reply-icon		{ width: {IMG_BUTTON_TOPIC_REPLY_WIDTH}px; height: {IMG_BUTTON_TOPIC_REPLY_HEIGHT}px; }
.buttons div.post-icon		{ width: {IMG_BUTTON_TOPIC_NEW_WIDTH}px; height: {IMG_BUTTON_TOPIC_NEW_HEIGHT}px; }
.buttons div.locked-icon	{ width: {IMG_BUTTON_TOPIC_LOCKED_WIDTH}px; height: {IMG_BUTTON_TOPIC_LOCKED_HEIGHT}px; }
.buttons div.pmreply-icon	{ width: {IMG_BUTTON_PM_REPLY_WIDTH}px; height: {IMG_BUTTON_PM_REPLY_HEIGHT}px; }
.buttons div.newpm-icon		{ width: {IMG_BUTTON_PM_NEW_WIDTH}px; height: {IMG_BUTTON_PM_NEW_HEIGHT}px; }
.buttons div.forwardpm-icon	{ width: {IMG_BUTTON_PM_FORWARD_WIDTH}px; height: {IMG_BUTTON_PM_FORWARD_HEIGHT}px; }
Если их нет, то добавить.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

skylink67 02 апр 2015, 17:28 Сообщение

Почему у меня кнопки становятся следующим образом:
  • 0
Вложения
Как сделать подсветку кнопок при на ведении? - 41.jpg
Как сделать подсветку кнопок при на ведении? - 41.jpg (38.79 КБ) 1782 просмотра

CabinetAdmin 02 апр 2015, 18:16 Сообщение

В настройках, на скриншоте видно, есть поле для высоты, укажите половину. Допустим если высота изображения 100px - укажите 50px.
  • 0
Хочешь поблагодарить? Есть способы: заходи на форум, создавай темы, делись опытом и наработками, общайся!

skylink67 02 апр 2015, 18:32 Сообщение

поставил вместо 50px 25px и всё получилось, спс
  • 0