Positionnement série décorées de balises div à l'écran en offset, DOM JQUERY CONNEXES

Question

J'utilise JQuery pour positionner une série de balises div qui utilisent essentiellement un intérieur de classe de l'étiquette qui décore les divs que les barres. Ainsi, la div est une boîte verte en fonction de ses spécifications css au verre.

J'ai une liste de démarrage postions,

une liste de coordiantes- gauche pour les points de départ que je souhaite placer ma DIV dire 556, 560, 600 celles-ci sont générées automatiquement en tant que positions à gauche dans une liste

J'ai une liste de la fin postions,

une liste de coordiantes- gauche pour les points de fin que je souhaite placer ma DIV dire 570, 590, 610 sont générés automatiquement ces positions comme à gauche dans une liste

maintenant pour chaque position de début et fin, la barre (boîte verte) Je veux être dessinée avec sa largeur appropriée comme suit. donc dire f est le décalage ou la position du début et ff la position ou décalage de l'extrémité:

tire dessous de la zone verte basée sur un seul début et de fin GAUCHE.

 if (f.left != 0) {

                        $("#test").html($("<div>d</div>")).css({
                            position: 'absolute',
                            left: (f.left) + "px",
                            top: (f.top + 35) + "px",
                            width: (ff.left - f.left) + 25 + "px"
                        }).addClass("option1");

                    }

Je cherche à boucler la liste des positons dans la liste et d'en tirer plusieurs boxs verts sur la base des positions à l'écran. Le code ci-dessus tire une seule boîte verte de la dernière position décalée.

Answer 1

Ok,

boucle Ainsi, à travers votre tableau de f.

f ff et ont la même longueur, je sais que la position 0 de la matrice f se rapporte à la position 0 du tableau ff.

actuellement vous mettez un div dans un élément appelé test, puis appliquer le positionnement absolu à l'élément « test », puis une classe.

changer le code légèrement au lieu d'utiliser html J'utiliser append

append devrait quitter tout code que vous avez peut-être déjà ajouté à l'élément "test".

Je aurait tendance à construire tout le style et les attributs de classe à ce point aussi.

$("#test").append("<div style='position:absolute;left:" + f[i].left + "px;top:" + ...
... + " class='optonal'>d</div>");

je peux avoir quelques erreurs de syntaxe désolé pour les