Как сделать подсветку кнопок при на ведении?

Поддержка форумов на phpBB 3.0.x
Создание, раскрутка, оптимизация, редактирование и настройка форума.
Со всеми этими и другими вопросами обращайтесь в этот раздел.
skylink67

Как сделать подсветку кнопок при на ведении?

skylink67 01 апр 2015, 00:31 Сообщение

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

Аватара пользователя
CabinetAdmin

Как сделать подсветку кнопок при на ведении?

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;.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект


Аватара пользователя
CabinetAdmin

Как сделать подсветку кнопок при на ведении?

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; }


Это как пример.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

skylink67

Как сделать подсветку кнопок при на ведении?

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

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

Аватара пользователя
CabinetAdmin

Как сделать подсветку кнопок при на ведении?

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

Через наборы изображений используемого стиля.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

skylink67

Как сделать подсветку кнопок при на ведении?

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

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

Аватара пользователя
CabinetAdmin

Как сделать подсветку кнопок при на ведении?

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; }

Если их нет, то добавить.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

skylink67

Как сделать подсветку кнопок при на ведении?

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

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

Аватара пользователя
CabinetAdmin

Как сделать подсветку кнопок при на ведении?

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

В настройках, на скриншоте видно, есть поле для высоты, укажите половину. Допустим если высота изображения 100px - укажите 50px.
Создать форум бесплатно на http://luckbb.ru/
Хочешь поблагодарить? Есть способы Поддержать проект

skylink67

Как сделать подсветку кнопок при на ведении?

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

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



Похожие темы

Вернуться в «Обсуждение вопросов»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и 3 гостя