Кнопка на сцене из картинки

Использование системы в различных ситуациях, вопросы программирования сценариев.

Модератор: immortal

Ответить
I_I_Imonder
Сообщения: 256
Зарегистрирован: Сб янв 11, 2014 2:54 pm
Благодарил (а): 12 раз
Поблагодарили: 14 раз

Кнопка на сцене из картинки

Сообщение I_I_Imonder » Сб янв 24, 2015 8:02 am

Доброго времени друзья!
Такой вопрос, как добавить на сцену css кнопку с картинкой?

Сделал несколько кнопок для сцены управления проектором и медиасервером и хочу чтобы кнопки вдавливались при нажатии
вот что нашел на просторах инета
<meta http-equiv="Content-type" content="text/html; charset=UTF-8">
<title>Button Test</title>
<style type="text/css" media="screen">
body {
padding: 50px;
}
#button {
display: block;
width: 135px;
height: 63px;
background: url(\on.png) no-repeat top;
}
#button:active {
background: url(\on.png) no-repeat bottom;
}
</style>
</head><body>
<a id="button"></a>
</body></html>

но как впихнуть в сцену не знаю( мб кто сталкивался

вот так выглядит сцена
Изображение
Аватара пользователя
Bagir
Сообщения: 1614
Зарегистрирован: Вт сен 17, 2013 6:46 pm
Откуда: Ярославская область город Углич
Благодарил (а): 212 раз
Поблагодарили: 375 раз

Re: Кнопка на сцене из картинки

Сообщение Bagir » Пт янв 30, 2015 1:56 pm

Windows 10, HTTP, MegaD, Z-Wave, 1-Wire, CONNECT
I_I_Imonder
Сообщения: 256
Зарегистрирован: Сб янв 11, 2014 2:54 pm
Благодарил (а): 12 раз
Поблагодарили: 14 раз

Re: Кнопка на сцене из картинки

Сообщение I_I_Imonder » Сб янв 31, 2015 8:37 am

Большое спасибо, я это читал.
а куда картинки положить?



разобрался)

div.element_83 {
display: block;
width: 135px;
height: 63px;
background: url(/cms/scenes/on.png) no-repeat top;
}
div.element_83:active {
background: url(/cms/scenes/off.png) no-repeat bottom;
}
Аватара пользователя
Bagir
Сообщения: 1614
Зарегистрирован: Вт сен 17, 2013 6:46 pm
Откуда: Ярославская область город Углич
Благодарил (а): 212 раз
Поблагодарили: 375 раз

Re: Кнопка на сцене из картинки

Сообщение Bagir » Сб янв 31, 2015 12:39 pm

ага, так, я просто забыл, что в том примере нет картинки а только текст. Еще можно нарисовать простенькие картинки кодом CSS.
А вот пример, как подставлять нужную группу с CSS кодом по условию http://smartliving.ru/forum/viewtopic.p ... 140#p17252
Windows 10, HTTP, MegaD, Z-Wave, 1-Wire, CONNECT
I_I_Imonder
Сообщения: 256
Зарегистрирован: Сб янв 11, 2014 2:54 pm
Благодарил (а): 12 раз
Поблагодарили: 14 раз

Re: Кнопка на сцене из картинки

Сообщение I_I_Imonder » Сб янв 31, 2015 3:21 pm

Проблема: мышкой нажимается, а вот на планшете нет(
что может быть?
Аватара пользователя
Bagir
Сообщения: 1614
Зарегистрирован: Вт сен 17, 2013 6:46 pm
Откуда: Ярославская область город Углич
Благодарил (а): 212 раз
Поблагодарили: 375 раз

Re: Кнопка на сцене из картинки

Сообщение Bagir » Сб янв 31, 2015 6:40 pm

А какой браузер на планшете? Стандартный проверен только на Андройде 4.4.2. А вот на 4.2.2 точно не работает. У него вообще большие проблемы с CSS. Мобильное приложение тоже использует стандартный браузер. Сейчас проверил кнопку на планшете в Хроме. Работает отлично. Правда кнопка у меня просто с текстом, без картинки.
Windows 10, HTTP, MegaD, Z-Wave, 1-Wire, CONNECT
Аватара пользователя
Bagir
Сообщения: 1614
Зарегистрирован: Вт сен 17, 2013 6:46 pm
Откуда: Ярославская область город Углич
Благодарил (а): 212 раз
Поблагодарили: 375 раз

Re: Кнопка на сцене из картинки

Сообщение Bagir » Сб янв 31, 2015 6:43 pm

Кстати, недавно узнал. К планшету можно без проблем подключить обычную USB мышку, в том числе и беспроводную. На экране появится указатель как на компе.
Windows 10, HTTP, MegaD, Z-Wave, 1-Wire, CONNECT
Ответить