Нажмите и оставайтесь в том же положении, когда скрывается какой-либо элемент над

Question

Нажмите и оставайтесь в том же положении, когда скрывается какой-либо элемент над

0

У меня есть контент вроде # 1, # 2, # 3, # 4 и более...

Когда я нажимаю readmore # 2 и нажимаю readmore # 1, это нормально, потому что скрытое содержимое расширяется ниже, а окно остается в том же положении.

Но когда я нажимаю readmore # 1 и scoll на контент # 2, то нажмите на readmore # 2

расширенный контент # 1 будет скрыт, а контент # 2 покажет полный контент.

Итак, позиция окна не остается в том же положении?

Я понятия не имею, как это сделать.

Может быть, использовать прокрутку к текущему расширенному элементу?

more_btn.on('click', function () {
    more_btn.show();
    more_content.hide();
    $(this).hide().next('div').show().css('display', 'inline');
});

PS: Если этот вопрос плохой, я сожалею и скажу, что я расширяюсь.

l2aelba 24 сен. 2013, в 10:42

Источник

Теги:

jquery

position

click

expand

2 ответа

3

Я не уверен, понимаю ли я то, что вы точно хотите, но если я правильно понимаю, то это может быть то, что вы ищете:

var more_btn = $('div > span');
var more_content = $('div > div');

more_btn.on('click', function () {
    more_btn.show();
    more_content.hide();
    $(this).hide().next('div').show().css('display', 'inline');
    $('html, body').animate({
        scrollTop: $(this).parent('div').offset().top
    }, 500);
});

demo: http://jsfiddle.net/My29d/1/

trrrrrrm 24 сен. 2013, в 07:18

0

Спасибо, это прокрутка Googe, я тоже это сделал. Но может ли все элемент оставаться в том же положении, как и до нажатия? (например, jsfiddle.net/My29d/2 , но контент readmore тоже его скрывает)
l2aelba 24 сен. 2013, в 08:24
0

что вы подразумеваете под той же позицией перед нажатием? Вы можете захватить значение scrollTop и после того, как вы сделаете анимацию, прокрутите назад к тому же значению
trrrrrrm 24 сен. 2013, в 08:25
0

как jsfiddle.net/My29d/2, но с расширенной функцией скрытия содержимого
l2aelba 24 сен. 2013, в 08:26
0

Если мы не можем сделать это, поэтому я буду использовать ваш текущий ответ: D
l2aelba 24 сен. 2013, в 08:28
0

Как насчет использования e.pageY, $ (this) .offset (). Top;
l2aelba 24 сен. 2013, в 08:38

Показать ещё 3 комментария

Ещё вопросы

Спасибо, это прокрутка Googe, я тоже это сделал. Но может ли все элемент оставаться в том же положении, как и до нажатия? (например, jsfiddle.net/My29d/2 , но контент readmore тоже его скрывает)
что вы подразумеваете под той же позицией перед нажатием? Вы можете захватить значение scrollTop и после того, как вы сделаете анимацию, прокрутите назад к тому же значению
как jsfiddle.net/My29d/2, но с расширенной функцией скрытия содержимого
Если мы не можем сделать это, поэтому я буду использовать ваш текущий ответ: D
Как насчет использования e.pageY, $ (this) .offset (). Top;

l2aelba · Accepted Answer · 2013-09-24T07-02-00.000Z

Я сейчас готов:

var more_btn = $('div > span');
var more_content = $('div > div');

more_btn.on('click', function (e) {
    var $this = $(this);
    var top = e.pageY - $(window).scrollTop();
    more_btn.show();
    more_content.hide();
    $(this).hide().next('div').show().css('display', 'inline');
    $('html, body').scrollTop(
        $this.next('div').offset().top - top
    );

});

Демо: http://jsfiddle.net/My29d/4/