如何滚动屏幕向左（如-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％）

回答

相关问题