Javascript 随机放置的div不会破坏容器
我想要的是改进我的代码。我现在做的是我有一堆有图像的div,所有的div都绝对位于一个相对的容器中。div的顶部和左侧位置是使用一些JS计算的Javascript 随机放置的div不会破坏容器,javascript,jquery,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.rand
$('.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您的猜测是正确的,代码将稍微修改如下:
$('.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'
});
});
你能不能把它发布在JSFIDLE上(使用HTML和CSS),这样我们就可以看到发生了什么?