FlProg

[ref]Qwert855[/ref],
да

artemka19 писал(а): 21 дек 2021, 23:54 (которые без вынесенных скриптов

что за вынесенные скрипты?

Вот вам кнопка меняющая цвет по состоянию(on/off). Цвета можно выбрать любые. Del
З.Ы. код JavaScript хромой, но работает. Буду продолжать трудится над этим:)
Цель присосаться к тем данным, которые получает вся html страница через JavaScript автора

Отправлено спустя 4 часа 56 минут 35 секунд:
Маленько подправил код. Теперь кнопка привязана не к ID "пользовательскому параметру", а к CSS стилям buttonX и colorX (писаться должны именно так). Это позволят привязывать их к любому "пользовательскому параметру"(только обязательно оба к одному параметру). ///////////////////////////////
Добавляем css стили в закладке "описание стилей"
[spoiler][/spoiler]

Добавляем кнопку с сис.параметром (в данном примере "Temp1")
Указываем стиль для кнопки buttonX
[spoiler][/spoiler]

Добавляем цветовой индикатор с таким же сис.параметром как в кнопке (в данном примере "Temp1")
Указываем стиль colorX
Настраиваем цвета по вкусу:)
[spoiler] [/spoiler]

Добавляем HTML код
[spoiler] [/spoiler]


Всё!

З.ы. последовательность размещения и место нахождения всех элементов не имеет значения

[ref]artemka19[/ref], Можете сам js код выложить? Хочется глянуть, а до компа тока после праздников доберусь

DrScorpion86 писал(а): 22 дек 2021, 16:38 Вот вам кнопка меняющая цвет по состоянию(on/off). Цвета можно выбрать любые.

Не могу сообразить если надо несколько кнопок сделать? Надо в HTML код внести изменения. Может пример выложите с двумя кнопками???

zhulen820 писал(а): 01 янв 2022, 23:53

DrScorpion86 писал(а): 22 дек 2021, 16:38 Вот вам кнопка меняющая цвет по состоянию(on/off). Цвета можно выбрать любые.

Не могу сообразить если надо несколько кнопок сделать? Надо в HTML код внести изменения. Может пример выложите с двумя кнопками???

Помочь смогу только после праздников.

[ref]zhulen820[/ref], В принципе...
Берёте этот код
<script>
setInterval(function(){
document.querySelector('.buttonX').style.backgroundColor = document.querySelector('.colorX').style.backgroundColor;
document.querySelector('.buttonX2').style.backgroundColor = document.querySelector('.colorX2').style.backgroundColor;
},300);
</script>

Для второй кнопки ставите стиль buttonX2, а для цветовой стиль colorX2

Отправлено спустя 1 час 4 минуты 5 секунд:

DrScorpion86 писал(а): 02 янв 2022, 20:30 Для второй кнопки ставите стиль buttonX2, а для цветовой стиль colorX2

Проверил, работает. Спасибо!

Набросал свой вид менюшки. Пока тока разбираюсь в CCS и HTML, прошу сильно не пинать. Много еще надо переделать. Да и много не хватает в самой Flprog
[spoiler]




[/spoiler]
Пример

У нас пока так получается, бьемся над расположением компонентов .
Кнопки работают

[spoiler][/spoiler]

pipapsix писал(а): 07 янв 2022, 15:59 У нас пока так получается, бьемся над расположением компонентов .
Кнопки работают

А выложите проект пожалуйста. Хочется посмотреть как кнопки в одну строку сделать.

zhulen820 писал(а): 07 янв 2022, 16:38 А выложите проект пожалуйста. Хочется посмотреть как кнопки в одну строку сделать.

Тут я сильно не помогу, сын делал и сказал , что тут руки связаны . С каждым объектом создается отдельный DIV.
Получилось расположить так кнопки с помощью создания таблицы, так что все данные будут в таблице , но говорит, что нужно еще подумать, может получится обойти это.
[spoiler][/spoiler]
Я тут вообще не понимаю)

Вот даю свои стили уже с настройками, где , что изменено не знаю. Просто заменить свои.

И в настроках кнопки. СТИЛЬ КНОПКИ ВПИСАТЬ button

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

[spoiler] .stText
{
font-family:TRENDY;
font-size:20px;
color:blue;
text-align:center;
}
.button {
background-color: #008CBA; /* Green */
border: 5px solid black;
color: #00FF00;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 20px;
margin: 4px 2px;
cursor: pointer;
}

.menu
{
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 1%;
margin: 1%;
width:16%;
border: 1px solid black;
border-radius: 8px;
}
.menuItem
{
font-weight: 600;
font-family: 'Times New Roman', Times, serif;
display: block;
margin: 5px;
width:95%;
}
.header
{
padding: 10px;
left: 0px;
right: 0px;
top: 0px;
background: #00FFFF;
text-align: center;
font-weight: 600;
font-family: 'Times New Roman', Times, serif;
font-size: 250%;
}
.content
{
display: grid;
float:right;
width:78%;
grid-template-rows: 1fr 1fr;
grid-template-columns: 150px 150px 150px;
}
.footer
{
float:left;
padding: 1%;
width:98%;
background: #00FFFF;
margin-top: 1%;
text-align: center;
font-weight: 600;
font-family: 'Times New Roman', Times, serif;
font-size: 150%;
}
.buttonFlp
{
width:150px;
border-radius:20px;
background:#459DE5;
color:#fff;
font-size:12px;
cursor:pointer;
float:left;
padding: 1%;
margin: 1%;
}
.buttonFlp:hover
{
background:#358DE5;
}
.buttonFlp:focus
{
outline:none;
}
.stLab
{
margin: 5px 0;
}
.stBtn
{
margin: 5px;
}
.stLig
{
margin: 5px;
width:50px;
height:50px;
border-radius:20%;
display: inline-flex;
align-items: center;
justify-content: center;
}
.stText
{
margin: 5px 0;
}
.stIF
{
margin: 5px 0;
}
.stWL
{
height:100px;
width:400px;
overflow: auto;
}
.stChb
{
margin: 5px 0;
}
.stRb
{
margin: 5px 0;
}
.stCB
{
margin: 5px 0;
}[/spoiler]

[ref]pipapsix[/ref], Тоже сделал с помощью таблицы. Может можно по другому, но пока не понял как

cmept-27 писал(а): 07 янв 2022, 18:07 Тоже сделал с помощью таблицы. Может можно по другому, но пока не понял как

Можно,там вариант есть несколько DIV в один засунуть и уже отдельно управлять, сын начал, но особой прыти нет в этом ковыряться), голжу хожу, надоедаю))
Просто я ему еще давно сказал, чтобы изучал программирование, а не блоками собирал, а теперь мне и говорит, ну не понимаю я твои блоки.

[ref]cmept-27[/ref], [ref]pipapsix[/ref],
Display: flex
или
Display: grid
Думаю вам лучше подойдёт именно display grid.
Почитайте-изучите;)

[ref]DrScorpion86[/ref],
Как ни странно, изначально пробовали Display: grid, не то. Перешли на Display: flex с еще одним костылем) Все прочитано и изучено)
Но все расно спс за совет.

Вот как и обещал, если будет получатся , что то более менее подходящее, выложу. В проекте только Вэб интерфейс, больше ничего.
Что и куда вставлено я не понял) но понять можно)
В принципе , для большего интерфейс мне и не нужен .
[spoiler][/spoiler]

[ref]DrScorpion86[/ref], Спасибо. Чуток разобрался.Display: grid получше таблиц. Совместил кнопку индикатор и текст )))
[spoiler]




[/spoiler]

кому нужно скину примеры из темы я откопал на я.диске архивы зачем минусите чела может он отойдет еще)

[ref=#000080]aidar_i[/ref], это пока его еще не удалили админы но тему первоисточник уже удалили