Please or Регистрация to create posts and topics.

Как я перестал беспокоиться и возненавидел Axma JS(Рекомендуется к прочтению новичкам)

НазадPage 2 of 2
Цитата: Einharr от 25.12.21, 23:18

Чтобы манипулировать переменными, массивами и элементами Dom - глубоких знаний не требуется, достаточно основ.

Что именно не получилось то? Документация оказалась слишком мудреной и непонятной?

Я вот не могу отключить кнопку. Блин. Исходный код помог бы разобраться как работает та или иная функция. Особенно для новичка в js. Axma оооочень удобна и крайне понятна, но какие то функции непонятно как реализовать. Так как в самой Аксме их реализация за стеной происходит.

например создание кнопки без переходов. Опытным путем узнал что у такой кнопки нет id и вообще это просто строка с тэгом “span”.  И получается доступа до самой кнопки нет, так как она создается как HTML объект и отчаянно не хочет выбираться.

В общем, github, как мне кажется - помог бы проекту. Другой вопрос в финансировании. Так пока есть хоть минимальная причина платить - HTML конвертация. А с Гитлм не факт что столько же людей будут «донатить» на хостинг.

Цитата: Darkon от 06.01.22, 15:49
Цитата: Einharr от 25.12.21, 23:18

Чтобы манипулировать переменными, массивами и элементами Dom - глубоких знаний не требуется, достаточно основ.

Что именно не получилось то? Документация оказалась слишком мудреной и непонятной?

Я вот не могу отключить кнопку. Блин. Исходный код помог бы разобраться как работает та или иная функция. Особенно для новичка в js. Axma оооочень удобна и крайне понятна, но какие то функции непонятно как реализовать. Так как в самой Аксме их реализация за стеной происходит.

например создание кнопки без переходов. Опытным путем узнал что у такой кнопки нет id и вообще это просто строка с тэгом “span”.  И получается доступа до самой кнопки нет, так как она создается как HTML объект и отчаянно не хочет выбираться.

В общем, github, как мне кажется - помог бы проекту. Другой вопрос в финансировании. Так пока есть хоть минимальная причина платить - HTML конвертация. А с Гитлм не факт что столько же людей будут «донатить» на хостинг.

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

Друзья, всех с прошедшими!

Интересный вопрос, а как вы смотрите на то, чтобы сам код следил за изменениями состояния экрана вместо ксс?

не первую неделю изучаю ваш пост, Einharr, но все же такая простая идея встала камнем преткновения.

В чем вопрос, я нахожу разные способы обращения кода Js к параметрам CSS. Изменение вёрстки и расположения спрайтов можно изменять относительно размеров экрана, добавив слушатель, если я правильно понял:

Банально:

function checkMediaQuery() {
if (window.innerWidth > window.innerHeight) {
спрайт.height = 10; // высота при горизонтальной ориентации
} else {
спрайт.height = 100; // высота при вертикальной ориентации
}
}
window.addEventListener('resize', checkMediaQuery);

в коде АКСМы .height и .width могут быть true и подстраиваться относительно самого экрана. Если менять их местами, в одном указывать Тру, в другом = число его размера, и добавить слушатель, можно динамично изменять верстку. Да и вообще координаты всех элементов.

Ваша идея, безусловно, более глобальная и правильная - компановка нужных спрайтов под одну оболочку, относительно которой они и будут прыгать. Сама аксма, как я пытался понять, все спрайты пихает в один div. Но пока банальная и прямая проблема в "нерасползании" объектов по экрану, по идее может решиться нативными инструментами аксмы и функции .sprite

И еще вопрос, можно ли упростить такую запись? нашел информацию где-то, что та запись через поиск размеров окна громоздкая и не играет на оптимизацию. Можно ли в коде Js выцепить запись состояния @media screen orientation - и если он в портрете провести такие-то изменения, если в горизонте - такие-то... Наверно тоже через listener.

Спасибо! И... понять простить)

Коллеги!
Благодаря дорогому другу-гуру, все же нашел правильное оформление в зависимости от ориентации. Я еще в наале пути понимания div'ов и дочерних элементов, пока "дедовски" на аксме.

Рабочая версия кода, как правильно выравнивать спрайты

В обычном параграфе:

спрайт = sprite(https://axma.info/wp-content/uploads/2018/12/icon.png); //задаем переменную-спрайт
спрайт.id = "above_BGmenu"; // сразу назначаем ей Id или можно класс
спрайт.left = 0; // необязательно. Координаты и выравнивание можно прописать в таблице стилей. Здесь указано значение, которое будет одинаковым при любой ориентации экрана
спрайт.filter = "grayscale(60%) brightness(2)"; // опытным путем определено, что фильтр можно менять напрямую к переменной - он сразу обращается к таблице стилей под ее id
спрайт.show(1000);

В параграфе стилей, в самом конце таблицы:

@media screen and (orientation: portrait) {
#above_BGmenu {
width: 85% !important;
height: auto !important;
top: -65% !important;
}
}

@media screen and (orientation: landscape) {
#above_BGmenu {
width: auto !important;
height: 35% !important;
top: -50% !important;
}
}

Все готово.
Еще лайфхак, если, допустим, нам надо сделать спрайт наподобие фоновой картинки как в функции picture(), можно прописать в свойствах тега таблицы:

#bottom_BGmenu {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}

НазадPage 2 of 2