Я пытаюсь нарисовать "центральную" часть для слайдера в css, но у меня возникли проблемы. Вот бесподобный макет того, к чему я стремлюсь: centerslider.png
Я попытался выйти за пределы css и вручную расположить div над ползунком, но затем я понял, что хочу, чтобы мой div был выше дорожки ползунка, но ниже подвижного курсора. Я не смог достичь этого только с помощью z-index.
Я также попытался использовать события «до» и «после» на исполняемой дорожке, чтобы можно было добавить дискретный контент оттуда. И это несколько сработало, когда я узнал, что мне нужно использовать inline-block , но я снова не смог заставить z-index играть хорошо, и он всегда был над подвижным курсором.
В обоих случаях мне, очевидно, не удалось добиться желаемого поведения перекрытия, но также стоит отметить, что у меня возникли проблемы с тем, чтобы что-то велось "чисто", когда я мог использовать систему координат координат существующего ползунка, чтобы поместить свою середину -бар (что-то вроде «ширина: 2%; слева: 49%», чтобы разместить его).
Я видел похожую функциональность, работающую в некоторых примерах, но они были слишком сложными по другим причинам, и мне было трудно почерпнуть много из них. Если бы кто-то мог указать мне на ресурс или ресурсы или описать минимальные элементы, необходимые для того, чтобы это работало, это помогло бы расширить мое личное понимание css. Я не против обучения, но я думаю, что мне нужно, по крайней мере, указать верное направление.