Question

So I have a shopping cart that has a fixed position on my page. Imagine something close to this except it’s not at an angle, and it’s facing perfectly vertically. What I want to do (with jQuery) is populate images over this image, randomly, with the only restriction being that they’re inside the shopping cart “basket” area.

I’m guessing there’s some way to refer to the area inside the shopping cart basket, and then just do some sort of jQuery append at those points.

I guess I’d start by using position()….

var pos = $("#myimage").position();
top = pos.top;  // top offset position
left = pos.left; // left offset position
right = pos.left + $("#myimage").width;
bottom = pos.top + $("#myimage").height;

And then get the x- and y- positions by doing something like the following:

var adjustedHigh = (top - bottom) + 1;

var y = Math.floor(Math.random()*adjustedHigh) + bottom

Not sure how to append to that coordinate though.

Answer 1

Set position:absolute on the images you’re appending and then set the values of your coordinates to the left and top CSS attributes respectively.