[英]How can I add an element with absolute position via jQuery or Javascript?
I have this line to add a new element in the screen, but the absolute position is not working. 我有这条线在屏幕上添加一个新元素,但是绝对位置不起作用。
Javascript 使用Javascript
function drawElement(e,name){
$("#canvas").append("<div id='" + name + "' class='element'"
+ "left="+e.pageX+" top=" + e.pageY +">"
+ name
+"</div>");
}
CSS CSS
.element{
display:inline-block;
background:blue;
position:absolute;
}
What I doing wrong? 我做错了什么?
var element = $('<div />',{'name': name, 'class': element})
.css({ 'left': e.pageX, 'top': e.pageY })
.html(name);
$("#canvas").append(element);
function drawElement(e,name){
div = $("<div />")
div.attr("id", name);
div.attr("class", 'element')
div.css("top", e.pageY)
div.css("left", e.pageX)
div.html(name)
$("#canvas").append(div)
}
Update: from comment below (didn't know you could do that!) :) 更新:从下面的评论(不知道你能做到!):)
function drawElement(e,name){
div = $("<div />")
div.attr({id: name, class: 'element'});
div.css({top: e.pageY, left: e.pageX})
div.html(name)
$("#canvas").append(div)
}
Write the top and left positions into the style attribute, like this-> 将顶部和左侧位置写入样式属性中,如下所示->
.append("<div id='" + name + "' class='element'"
+ "style='left:"+e.pageX+";top:" + e.pageY +";'>"
Although you should probably do it like this, so that it's more... controllable. 尽管您可能应该这样做,但是它更……可控。
var newElem = $('<div />').addClass('element').css({'left': e.pageX, 'top' : e.pageY});
$("#canvas").append(newElem);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.