hint000,
Да у меня точка с запятой и дробная часть запятая.
Поправил.
Теперь ошибок нет, но и нет изменений ни каких. Как будто нет ни чего после знака *, хотя если там удалять скобки или запятые будет ошибка.
Ну примерно, прописано значение всех страниц -0%, -100%, -200%, при определённом checked input.
Это я понимаю но длинно.
Видел вариант ещё длиннее, при определённом checked, прописываются положения всех остальных страниц.
Но хочется короче. Но не могу его исполнить.
Вот чей-то пример с очень коротким механизмом.
Он такой короткий только из-за того что в html подряд идут input - label - div / input - label-div и так далее.
И сделать его таким-же коротким при моей структуре html не возможно ?
И мне нужно использовать только те варианты которые доступны при моём расположении компонентов в html ?
То есть нечто вот такое. Что и есть по сути самым первым примером + в данном примере используются ID, которые мне и нужны.
Во-вторых, если это название слайда (страницы), то с чего это оно будет псевдо от лейбла.
Пол дня убил, искал короче путь. Но пошёл по-длинному.
Пришлось все before - after checked и так далее писать под каждый id.
Кнопку доделал, как и должна появляться выпуклость before.
И название, как и думалось вывести ::after прекрасно вышло (нормально только анимировать осталось его), добавил каждому label атрибут или как оно правильно data-on-label и вот его выводит.
Если нетрудно подскажите как теперь убрать cursor pointer с того места куда выводится этот текст.
Он почему то только на 6 и 8 label показывает. Код выше отредактирован.
У меня с простым слайдером будет больше вопросов чем, если бы тот начал перерабатывать методом тыка. Это тоже сейчас делал также.
Вот что вышло, правдо всё в куче.
Но как добавить label-у before и after, мне нужно нажатую кнопку доделать не только фоном, а after нужен чтоб выводил название страницы не напротив каждого кругляшка, а в одном месте между лого и донатом.
И цвета каждой страницы как менять ? псевдо ребёнком у slides.
Так вам нужно чтобы хедер был поверх слайдера или наверху страницы, а ниже слайдер?
Мне без разницы Header как сущность или как class div.
Мне нужно вверху полоса на которой будут расположены инпуты управления прокруткой страницы ниже этой полосы. Вот увеличенное до 300%. Input на самом верху они 8fr шириной и минимум 400px, дальше некий блок с лого и кнопкой (там чашка будет и вылетать круглые значки вариантов) шириной 6fr с минимальной 400px. А вот всё что ниже будет крутится.
Давайте отталкиваться нет от мною предложенного слайдера а от вашего минимального, на tab.
:target не интересен, как сделать модальные окна занимающие именно то место в гриде и расположить кнопки в каком угодно месте, я прекрасно понимаю. А это куда легче.
Просто по задумке, при листании слайдера в последствии, задумана и авто перекраска всего что выше в ту же гамму что и страница. Но это не сейчас.
Хочется это победить и начинать заполнять страницы svg анимацией, того характера чему посвящена страница.
Ankhena,
Как бы лучше объяснить. Делать не нужно просто в двух словах объяснить, а там буду сам разбираться.
Суть в том чтоб header засунуть в слайдер, на него переместить input (раз их нельзя выносить за пределы контейнера слайдера) + нужные мне элементы. header, input и остальное что там z-index вынести в перёд (или это не правильно ?) А вот оставшееся место уже листать.
В том слайдере там label который и есть страницами он 100vh, если его место положения будет ограничено ячейками грида, листать то будет уже именно они ?
Ankhena,
Пока ни чего не понятно. Так как изначально я не то делал (я думал что input можно выносить).
По факту у меня в body находятся два контейнера.
Один в котором верхняя полоса в 160px.
Второй контейнер слайдера.
И имею я сейчас.
Экран в котором верхняя полоса занимает своё место, и ни когда его не меняет.
А вот у слайдера нижняя часть страницы не видна. И при сдвиге на 100%. как раз эта нижняя часть оказывается под верхней, соответственно нижняя часть второй страницы опять не видна.
Ладно я понял что мне нужно двигаться в направлении того.
Что в Body изначально нужно класть всего один контейнер слайдера, а вот в нём реализовывать верхнюю часть которая не будет двигаться. И вот уже тогда и спрашивать, если не получается.
Ankhena,
Высота слайдера равна, я только могу предположить calc(100% - 160px).
Страница сайта должна занимать 100vh. Без никаких прокруток.
Верх уже занимает 160px. Всё остальное ниже, высотой 4fr.
Спасибо. с border-radius: 0 10px 10px 0; всё работает.
Можно к вам ещё вопрос.
Чтоб анимация начиналась и заканчивалась не началом и концом. Правильно только в hover править ? В пятом ребёнке вроде работает. А вот в первом не очень. В общем нужно clip-path рассмотреть, по идее если мне нужно всего 2 угла то и количество span можно уменьшить.
&:hover {
> span:nth-child(1) {
clip-path: polygon(50% 50%, 0 40%, 0% 0%);
> span:nth-child(5) {
clip-path: polygon(50% 50%, 0% 100%, 0% 60%);
Написано
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.
Да у меня точка с запятой и дробная часть запятая.
Поправил.
Теперь ошибок нет, но и нет изменений ни каких. Как будто нет ни чего после знака *, хотя если там удалять скобки или запятые будет ошибка.