положение: абсолютный и прокручиваемый div

0

У меня есть прокручиваемый div состоящий из строк. Каждая строка имеет невидимый span который становится видимым, когда вы нажимаете на строку. Пролет при открытии (правильно) на той же высоте строки.

Однако, если я прокручиваю основной контейнер, поскольку промежутки находятся в фиксированном положении, они больше не будут на одной высоте строки. Поскольку этот вопрос действительно трудно объяснить, здесь JSFiddle я подготовил. Попробуйте щелкнуть строку без прокрутки. Перезагрузите страницу и повторите попытку, но только после прокрутки до нижнего.

position:absolute - единственное, что я могу сделать, чтобы позволить "всплывать" в строке, но в то же время это то, что прикручивает позиционирование относительно строки. position:relative должен работать, но диапазон значительно больше, чем строки, а последние используют overflow:hidden.

Обратите внимание, что пример - быстрая копия сложной структуры, созданной с библиотеками привязки данных: я не могу изменить эту структуру, и jQuery даже не вариант. В идеале мне нужно решить эту проблему только с помощью CSS, но я понятия не имею, как: есть ли альтернатива position:fixed что работает, если я прокручиваю div?

  • 0
    Дает ли положение пролета: относительное; из варианта? Похоже, дает функциональность, которую вы ищете. jsfiddle.net/MathiasaurusRex/LM32h/6
  • 0
    к сожалению, я не могу - я обновляю вопрос и скрипку, чтобы показать почему. Строки должны использовать переполнение: скрытый, чтобы предотвратить выход содержимого, и его размер больше строк. Спасибо за вашу помощь, кстати!
Теги:

1 ответ

1
Лучший ответ

Попробуйте установить top с помощью JS в событии click.

$('.row').click(function () {
    var pos = $(this).position().top;
    $(this).find('span').css({
        "display": "block",
        "top":pos
    });
});

Может захотеть добавить/вычесть из pos, в зависимости от точного размещения.

http://jsfiddle.net/daCrosby/LM32h/8/

Ещё вопросы

Сообщество Overcoder
Наверх
Меню