Променете позицията на css на фиксирана, без да нулирате позицията на превъртане

Как бихте променили css позицията на елементи на фиксирана, без да нулирате текущата позиция на превъртане?

Използване на скрипт за промяна на позицията:

$('.bigwidth').click(function() { 
     $(this).css('position','fixed');    
})

този пример: http://jsfiddle.net/7gRZJ
ако превъртите елемента, след това щракнете върху елемента, той ще го промени на фиксирана и ще нулира позицията на превъртане..

Желаното поведение е да го промените на фиксирано, като същевременно запазите текущата позиция на превъртане.


scroll jquery css position
person bushdiver    schedule 15.07.2013    source източник

Отговори (3)


arrow_upward
3
arrow_downward

Добавянето на „return false“ във функцията за щракване ще предотврати поведението по подразбиране за връщане обратно в горната част на страницата/нулиране на позицията на превъртане.

Актуализиран код:

$('.bigwidth').click(function() { 
     $(this).css('position','fixed');
     return false;    
})
person JasonStockman    schedule 15.07.2013
comment
Това е много по-просто решение от всеки друг вариант. Работи идеално. - person Eric Wiener; 06.03.2017

arrow_upward
2
arrow_downward

Тъй като позиционирането на елемента се превръща в fixed, това означава, че той ефективно се изважда от оформлението на страницата. Това означава, че тялото ще престане да се разширява до ширината си в момента, в който атрибутът му за позиция бъде променен, така че то скача обратно наляво. Един от начините за решаване на това е да препозиционирате елемента, за да симулирате предишната позиция на превъртане след промяна на неговия атрибут за позиция. Така че вашият скрипт може да изглежда нещо като:

$('.bigwidth').click(function() {
     var scrolled = $(document).scrollLeft();
     $(this).css('position','fixed');
     $(this).css("left", -scrolled);
});

Ето пример за това, че това работи.

person Serlite    schedule 15.07.2013

arrow_upward
0
arrow_downward

Ако превъртането се нулира автоматично, можете да го нулирате след щракване. Вземете действителната позиция на скрола -> променете позицията на фиксирана и нулирайте скрола с предишната позиция. Използвайте метода .scrollTop(), за да го постигнете --- jquery

person Mollo    schedule 15.07.2013