如何滾動屏幕向左（如-100％）

我得到這個代碼連接到我的div上http://g7media.cz/svilla/如何滾動屏幕向左（如-100％）

滾動到右側的偉大工程，但我不能向左滾動的內容。

在這段代碼中，我認爲我滾動屏幕trought html和body來留下內容，就像我在另一邊做的一樣。

var screen_position =0; 

var height=$(window).height()-$('.header').height()-$('.footer').height()-95; 

$('.content').css('max-height', height); 

$('a.toright').on('click', function(event) { 
    var screen_width=$(window).width(); 
    var divwidth = $('.backgroundright').width(); 

    if(screen_position == 0) { 
     $('html, body').animate({ scrollLeft: screen_width}, 800); 
     screen_position=screen_width; 
     $('.backgroundright').animate({'right': screen_width-divwidth}, 800); 
    } 
    else { 
     screen_position = screen_position-screen_width; 
     $('html, body').animate({ scrollLeft: screen_position}, 800); 
     $('.backgroundright').animate({'right': 0}, 800); 
    } 



    event.preventDefault(); 
    //console.log(screen_position); 
}); 

$('a.toleft').on('click', function(event) { 
    var screen_width=$(window).width(); 
    var divwidth = $('.backgroundleft').width(); 

    if(screen_position == 0) { 
     $('html, body').animate({ scrollLeft: 0-screen_width}, 800); 
     screen_position=screen_width; 
     $('.backgroundleft').animate({'left': 0-screen_width}, 800); 
    } 
    else { 
     screen_position = screen_position-screen_width; 
     $('html, body').animate({ scrollLeft: 0}, 800); 
     $('.backgroundleft').animate({'left': 0}, 800); 
    } 



    event.preventDefault(); 
    //console.log(screen_position); 
});

感謝您的建議。

來源

2014-10-06 Michal Běhal

您的代碼有效。我只是將「滑動到左側」div的位置移動到了正確的頁面上，並且一切看起來都正常。它被留下：0;現在剩下了：100％;

更新這裏的CSS：

.hometoleft { 
    background: url("/svilla/img/homepagetoleft.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); 
    height: 407px; 
    left: 100%; 
    position: absolute; 
    top: 30%; 
    width: 124px; 
    z-index: 1; 
}

來源

2014-10-06 11:33:04 Nick

其實我需要證明它有位置.backgroundleft內容左：-100％。爲此，我想點擊a.toleft並想將屏幕移動到左側。 – 2014-10-06 16:06:09

你的代碼也適用於此。 CSS是問題。只需添加「z-index：1;」到style.css中的backgroundleft類（第93行）。該頁面正在生成動畫，但低於其他所有圖層，因此無法看到！但是，仍然有一些與您的代碼有關的工作，因爲它將「左」按鈕視爲一個實體，並且正在切換左側窗格而不是滾動回主頁。 – Nick 2014-10-09 08:44:07

我弄錯了這段代碼。我想像我一樣移動屏幕來滾動到右頁。我使用的代碼移動div「背景」的權利，但代替它，我想移動屏幕到這個div（左邊的屏幕寬度）。所以它應該是這樣的 $（'html，body'）。animate（{scrollLeft：0-screen_width}，800）; （'。backgroundleft'）。animate（{'right'：screen_width}，800）; – 2014-10-09 13:16:10

如何滾動屏幕向左（如-100％）

回答

相關問題