Question

请看一下这个网站：

滑块的背景如何工作？我认为这是一个div，但是如何将它放在其他所有内容之后，当你向下滚动时，你会看到滑块背景图片上的效果如何让滑块的背景像这样，当有人滚动页面时更改。

Answer 1

你想要的是一个jQuery滚动脚本。在该页面中，请查看底部的

if ($('#slider'))
            {
                $(window).scroll(function(e)
                {
                    var scrollTop = $(this).scrollTop();
                    if (scrollTop <= 520)
                    {
                        if (scrollTop < 60)
                        {
                            scrollTop = 60;
                        }
                        $('#slider').css('-webkit-transform', 'translate3d(0,'+Math.floor((scrollTop-60)/2)+'px, 0)').css('-moz-transform', 'translate3d(0,'+Math.floor((scrollTop-60)/2)+'px, 0)');
                    }
                });
            }

这就是造成这种行为的原因。您还可以使用Stellar，Skrollr等脚本。它被称为视差滚动

Answer 2

你必须为div设置z-index以显示彼此

 .divClass{
    z-index: x ;

 }

注意：x是一个数字。

如果您有两个具有两个不同类的div：

 .divClass1{

   z-index:100;
 }

 .divClass2{

   z-index:101;
 }

.divClass2显示在divClass1

上方

Answer 3

使用z-index

#divid
{
    z-index: 100;
}

#divid div
{
    z-index: 101;
}

滚动页面时滑块的背景会发生变化，怎么可能

3 个答案: