CODEWITHSUNDEEP
javascript
WhiteLine
WhiteLine

Reputation: 1991

Spin.js , append div (with absolute position) and spin it

I'm using Spin.js

What I would do is this: "append" a div (with absolute position) to another main-div and active Spin on it.

Javascript Code

s+="<div style='position:relative;margin-top:"+obj.top+"px;margin-left:"+obj.left+"px;width:180px;height:70px;background-image:url(img.png);' oggetto='1' id='id1'>";
    s+="</div>";

$("#miodiv").append(s).spin();

Html result of Append

<div style="position:absolute;margin-top:365px;margin-left:470px;width:180px;height:70px;background-image:url(img.png);" oggetto="1" id="id1"></div>

The Spin is add to the div but not in the center , but in the middle of the page.

I've seen questions like this on SO (...), which gave as a solution adding position:relative to the div, but I have to keep position:absolute.

Also if from the console of google chrome call: 

$("#id1").spin();

the spin is successfully added to the center of div

UPDATE

Added JSFIDDLE, which represents in a simplified way my situation

Upvotes: 0

Views: 628

Answers (1)

Alex Art.
Alex Art.

Reputation: 8781

Try to give to your dynamically created div an id (lets say spinContainer) and add the spinner like this:

var spinner = new Spinner().spin($("#spinContainer"));

You also have a problem with your code here:

s+="<div style='position:relative;margin-top:"+obj.top+"px;margin-left:"+obj.left+"px;width:180px;height:70px;background-image:url(img.png);' oggetto='1' id='"+passid+"'>";
    s+="</div>";

$("#"+passid).append(s).spin();

In the first line you creating a div with id = passid

and here $("#"+passid).append(s).spin() you appending this div to some other element with the same id...

EDIT: Check the FIDDLE - you supposed to add the spin to the div that you dynamically create and not to the parent div.

Upvotes: 1

Related Questions