Javascript 滚动时标题中会出现小行

我有一个横幅，当你滚动时会模糊。有一个包含站点标题的标题框。滚动时，文本下方会出现小行。当我使用iPad时，这些线条不会出现，只会出现在桌面上。你可以明白我说的去是什么意思

---

HTML/CSS

<div class="banner-b" style="display: table; width: 100%; position: relative; height: 450px; background: url(http://www.imagesgallerys.com/wp-content/uploads/summer-flowers-1920x1080-wallpaper-5426-jpg-20150520060357-555c23cd5d73c.jpg) center no-repeat; background-size: cover; top: 0; left: 0; right: 0; bottom: 0;">
                <div class="overlay-b" style="position: absolute; top: 0; right: 0; left: 0; bottom: 0; background: url(http://i.imgur.com/TO7ROHx.jpg) center no-repeat; background-size: cover; z-index: 10; opacity: 0;"></div>
                <div class="content-b" style="z-index: 10; text-align: center; position: relative; top: 50%; transform: translateY(-50%); font-size: 50px;">
                    <hgroup style="height: 60px; margin-top: 150px; display: inline-block; vertical-align: middle; text-align: center; position: relative; top: 50%; left: 0%; color: #fff; border: 5px solid #fff; padding: 40px; background-color: rgba(0, 0, 0, .7); z-index: 0;">
                         <h1 style="margin: 0px auto; color: white; text-align: center;">Wolf Valley</h1>

                    </hgroup>

                </div>
            </div>

狼谷

JavaScript:

<script>
    var $content = $('header .content-b'),
        $blur = $('header .overlay-b'),
        wHeight = $(window).height();

    $(window).on('resize', function() {
        wHeight = $(window).height();
    });
    window.requestAnimFrame = (function() {
        return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function(callback) {
            window.setTimeout(callback, 1000 / 60);
        };
    })();
    function Scroller() {
        this.latestKnownScrollY = 0;
        this.ticking = false;
    }

    Scroller.prototype = {
        init: function() {
            window.addEventListener('scroll', this.onScroll.bind(this), false);
        },

        onScroll: function() {
            this.latestKnownScrollY = window.scrollY;
            this.requestTick();
        },

        requestTick: function() {
            if (!this.ticking) {
                window.requestAnimFrame(this.update.bind(this));
            }
            this.ticking = true;
        },

        update: function() {
            var currentScrollY = this.latestKnownScrollY;
            this.ticking = false;

            var slowScroll = currentScrollY / 4,
                blurScroll = currentScrollY * 4;

            $content.css({
                'transform': 'translateY(-' + slowScroll + 'px)',
                    '-moz-transform': 'translateY(-' + slowScroll + 'px)',
                    '-webkit-transform': 'translateY(-' + slowScroll + 'px)'
            });

            $blur.css({
                'opacity': blurScroll / wHeight
            });
        }
    };
    var scroller = new Scroller();
    scroller.init();
</script>

var$content=$（'header.content-b'），
$blur=$（'header.overlay-b'），
wHeight=$（窗口）.height（）；
$（窗口）.on（'resize'，function（））{
wHeight=$（窗口）.height（）；
});
window.requestAnimFrame=（函数（）{
返回window.requestAnimationFrame | | | window.webkitRequestAnimationFrame | | | window.mozRequestAnimationFrame | |函数（回调）{
设置超时（回调，1000/60）；
};
})();
函数滚动条（）{
this.latestKnownScrollY=0；
this.ticking=false；
}
Scroller.prototype={
init:function（）{
window.addEventListener（'scroll'，this.onScroll.bind（this），false）；
},
onScroll:function（）{
this.latestKnownScrollY=window.scrollY；
this.requestTick（）；
},
requestTick:function（）{
如果（！这个。滴答声）{
window.requestAnimFrame（this.update.bind（this））；
}
this.ticking=true；
},
更新：函数（）{
var currentScrollY=this.latestKnownScrollY；
this.ticking=false；
var slowScroll=currentScrollY/4，
blurScroll=currentScrollY*4；
$content.css({
“transform”：“translateY”（“+slowScroll+”px）”，
“-moz transform”：“translateY”（“+slowScroll+”px）”，
“-webkit transform”：“translateY（-”+slowScroll+“px）”
});
$blur.css({
“不透明度”：模糊滚动/旋转
});
}
};
var scroller=new scroller（）；
scroller.init（）；

---

您能提供屏幕截图吗？我看不到chrome Win7下有任何错误代码，你在哪个浏览器上测试它？在其他浏览器上有相同的行为吗？就像我说的，对我来说，这一行没有出现。也许可以试试：

header.content-b{outline:1px solid transparent；}

它看起来像一个重新绘制的UI bugHey！令人惊叹的！你发给我的密码很有效。非常感谢！你能提供截图吗？我看不到chrome Win7下有任何错误代码，你在哪个浏览器上测试它？在其他浏览器上有相同的行为吗？就像我说的，对我来说，这一行没有出现。也许可以试试：

header.content-b{outline:1px solid transparent；}

它看起来像一个重新绘制的UI bugHey！令人惊叹的！你发给我的密码很有效。非常感谢！你能提供截图吗？我看不到chrome Win7下有任何错误代码，你在哪个浏览器上测试它？在其他浏览器上有相同的行为吗？就像我说的，对我来说，这一行没有出现。也许可以试试：

header.content-b{outline:1px solid transparent；}

它看起来像一个重新绘制的UI bugHey！令人惊叹的！你发给我的密码很有效。非常感谢！