6

我的页面上有一个 Flash 元素，由于 Flash 通常非常精细，因此需要将其定位在整数像素值处（如果您需要详细信息，请参阅Flash 网络摄像头访问请求提示无响应）。

我通过将 包装在object中，在 上div设置，并使用 jQuery 设置并舍入到包含的. 那是一口，这里是代码形式：position:absoluteobjectlefttopoffsetdiv

<div id="wrapper">
    <object id="flash" blah style="position:absolute">
        <!-- blah -->
    </object>
</div>
<script>
    function update(){
        var p=$('#wrapper').offset();
        $('#flash').css({'left':Math.round(p.left),'top':Math.round(p.top)});
    }
    $(document).ready(function(){
        $(window).resize(update);
        update();
    });
</script>

这一切都很好（如果上面的代码有错误，那只是把它删掉了）

这将在浏览器更改大小时更新位置，并且在某些 JavaScript 更改位置时更新它很容易，但页面也使用 CSStransition-duration为一些更改设置动画。我怎样才能检测到这个？至少，我想检测影响对象的过渡何时发生，并知道它何时停止。理想情况下，我想知道如何捕捉任何运动（例如由字体大小更改或图像加载引起的）。

4

1 回答 1

0

Could you check this fiddle: http://jsfiddle.net/DpYNm/ It logs when a movement starts and ends, I'm not sure if it's the solution to your problem, but it just might help you in the right direction!

function checkForMove() {
if ($('#testDiv').prop('user_default_width') === undefined) {
    $('#testDiv').prop('user_default_width', $('#testDiv').width());
    $('#testDiv').prop('user_is_moving', false);
}

if ($('#testDiv').width() != $('#testDiv').prop('user_default_width') && !$('#testDiv').prop('user_is_moving')) {
    $('#log').html($('#log').html() + "Move started<br/>");
    $('#testDiv').prop('user_is_moving', true);
}
if ($('#testDiv').width() == $('#testDiv').prop('user_default_width') && $('#testDiv').prop('user_is_moving')) {
    $('#log').html($('#log').html() + "Move ended<br/>");
    $('#testDiv').prop('user_is_moving', false);
}

setTimeout(checkForMove, 1);

}

checkForMove();

The checkForMove is called every ms and in the first call it will save the width of the div to a property. Everytime it changes (start of transition) it will log and save a helper property to ensure it will not log again until the transition is back to the default size. I'm sure you can change that part to fit it to your needs! :)

于 2013-04-29T06:26:06.670 回答