随机放置的div不破坏容器

时间:2013-09-20 10:49:54

标签: javascript jquery

我所追求的是改进我的代码。我目前正在做的是我有一堆有图像的div,所有div都位于相对容器内。 div的顶部和左侧位置是使用一些JS计算的。

$('.each-artist-landing-image-container').each(function() {
    $(this).css({ 
        'top':  Math.floor((Math.random() * 300) + 1) + 'px', 
        'left': Math.floor(Math.random() * 400 + 1) + 'px' 
    });
});

正在发生的事情,我不想要,但是由于这些职位......由于职位是随机的,他们有时会从相关容器中脱离出来。

有没有办法计算顶部和左侧位置但不会破坏相对容器?我猜它需要获得图像宽度,然后确保宽度不在容器外面?

提前致谢, [R

1 个答案:

答案 0 :(得分:0)

您的猜测是正确的,代码会稍微修改如下:

$('.each-artist-landing-image-container').each(function() {
    var $this = $(this);
    $this.css({ 
        'top':  Math.floor((Math.random() * (300 - $this.height())) + 1) + 'px', 
        'left': Math.floor(Math.random() * (400 - $this.width()) + 1) + 'px' 
    });
});