Wie kann ich die horizontale Position eines festen Divs beim Scrollen korrigieren?

Horizontales Scrollen von Divs mit fester Position

In dieser Abfrage sucht ein Benutzer nach einer Lösung, um Inhaltskonflikte zu verhindern, wenn ein Div mit fester Position horizontal gescrollt wird neben anderen Inhalten. Die anfängliche Implementierung mit jQuery korrigiert das Div erfolgreich vertikal, es fehlt jedoch die Unterstützung für horizontales Scrollen.

Die vorgeschlagene Lösung beinhaltet die Änderung des jQuery-Codes, um die linke Eigenschaft des Elements zu manipulieren:

var leftInit = $(".scroll_fixed").offset().left;
var top = $('.scroll_fixed').offset().top - parseFloat($('.scroll_fixed').css('margin-top').replace(/auto/, 0));


$(window).scroll(function(event) {
    var x = 0 - $(this).scrollLeft();
    var y = $(this).scrollTop();

    // whether that's below the form
    if (y >= top) {
        // if so, ad the fixed class
        $('.scroll_fixed').addClass('fixed');
    } else {
        // otherwise remove it
        $('.scroll_fixed').removeClass('fixed');
    }

    $(".scroll_fixed").offset({
        left: x + leftInit
    });

});

Erklärung

1. leftInit speichert den anfänglichen linken Offset des Div.
2. Beim Scrollen wird der x-Wert als Negativ des aktuellen Scroll-Offsets festgelegt verschiebt das Div effektiv zusammen mit dem horizontalen Bildlauf.
3. leftInit stellt sicher, dass jeder linke Rand des Divs ordnungsgemäß berücksichtigt wird.

Dieser Ansatz behält die feste Position des Div bei und lässt ihn gleichzeitig zu um horizontal entlang des Inhalts zu scrollen, um Konflikte zu vermeiden und die Benutzererfahrung zu verbessern.

Das obige ist der detaillierte Inhalt vonWie kann ich die horizontale Position eines festen Divs beim Scrollen korrigieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!