Question

An Example of the problem

随机我在屏幕上有一个角色。他从屏幕开始，顺利地移动到屏幕上。但是我有它在屏幕外移动的问题。现在我使用jquery将他放入体内。当它到达右侧时，我打算通过检查宽度来移除他并等到他完全离开屏幕（就在他离开屏幕之前，他的身体应该被涂上一半）。问题是，当他向右移动时，宽度变大，我看到一个滚动条出现。

如何让角色不影响宽度，让身体部分涂上（在右侧，左侧不是问题）并知道什么时候完全看不见？

Answer 1

function MoveCode(){
    var l = $('.ball').css("left");
    $('.ball').css("left", (parseInt(l) + 8) + "px");
    setTimeout(MoveCode, 160);
}

$('body').append('<div style="width:100%; overflow:hidden;"><img class="ball" src="http://michaelreid.typepad.com/.a/6a00e54edabd838833011168a00f09970c-800wi"/></div>');
MoveCode()

只需将您的图像包装在一个div中，这样您就可以设置溢出：隐藏在其上而不会与页面混在一起。

Answer 2

只需在overflow:hidden;元素上设置html：

html {
   overflow:hidden;
}

jsfiddle example

平滑地移动屏幕HTML上的字符

2 个答案: