如何更改div标签的位置?

时间:2016-05-31 11:21:19

标签: javascript html css

我正在尝试更改已创建的div元素(标签)的位置,但我无法检索div元素的属性/属性。

    function labelBox(cardinal, radius, root)
        {
            var labelID = 'MovingLabel'+ cardinal.ID;
            this.position = convertlatlonToVec3(cardinal.lat, cardinal.lon).multiplyScalar(radius);


            this.box = document.createElement('div');
            a = document.createElement('div');
            a.setAttribute("id", labelID);
            a.innerHTML = cardinal.name;


            $(a).data("id", cardinal.ID);
            $(a).click(function(){

                triggermarker = markers[parseInt($(this).data("id")) -1 ];
                google.maps.event.trigger(triggermarker, 'click');
            });

            this.box.className = "spritelabel";
            this.box.appendChild(a);

            this.domElement = root;
            this.domElement.appendChild(this.box);

        }

    labelBox.prototype.update = function()
    {

        camera.updateMatrixWorld();
        this.position.project(camera);

        var screenvector = new THREE.Vector3();
        screenvector.copy(this.position);
        oldlabelpos.push(screenvector);


        var posx = Math.round((this.position.x + 1)* this.domElement.offsetWidth/2 + webglviewport.left);
        var posy = Math.round((1 - this.position.y)* this.domElement.offsetHeight/2);

        var boundingRect = this.box.getBoundingClientRect();  

        this.box.style.left = (posx - boundingRect.width) + 'px';
        this.box.style.top = posy + 'px';

        this.occludeLabel(this.box, this.marker);

    };

//trying to change the position of the div elements with this LabelUpdateFn
    LabelUpdateFn = function()
        {
            var labels = document.getElementsByClassName('spritelabel'); 

            for(var k=0; k<oldlabelpos.length; k++)
                {
                    var position = new THREE.Vector3();
                    position = convertlatlonToVec3(oldlabelpos[k].x,     oldlabelpos[k].y).multiplyScalar(radius);                   
                    position.normalize();

                    camera.updateMatrixWorld();
                    position.project(camera);

                    var updateposx = Math.round((position.x + 1)* root.offsetWidth/2 + webglviewport.left);
                    var updateposy = Math.round((1 - position.y)* root.offsetHeight/2);

                    var updatedpos = {updateposx, updateposy};

                    newlabelpos.push(updatedpos);

                }

                for(var i=0; i<labels.length; i++)
                    {

               //unable to access the properties of div element to change 
                    labels[i].style.left = newlabelpos[i][0] + 'px';
                    labels[i].style.top = newlabelpos[i][1] + 'px';

                    }
    }

0 个答案:

没有答案