0

我的页面上有一个 div，感谢 jQuery，我想在这个 div 上方叠加一个文本。此文本必须水平和垂直居中。我需要这个来向用户展示这个区域被允许在其中放置一个文件。

<div class="dropzone" style="width: 300px; height: 200px; background-color: gray">
    Lorem ipsum blah blah... Lorem ipsum blah blah... Lorem ipsum blah blah... Lorem ipsum blah blah... Lorem ipsum blah blah... Lorem ipsum blah blah... 
</div>

JsFiddle：http: //jsfiddle.net/Dd2jq/

我不知道如何继续在我的 div 上方注入文本。我知道我们有附加 jQuery 函数，但不知道如何继续。

非常感谢任何帮助。

4

3 回答 3

1

您可以使用新功能使其变得非常简单：jQuery.position()

var $span = $('<span/>').text('Hello, world');
$span.position({ of: $('.dropzone') });

这里看起来很简单，因为 span 默认居中。

但是...新的position()函数可以让您对定位进行大量控制（而且它很容易使用）。

笔记：

此功能在 1.8 版本中添加到jQuery UI。

这是一个小提琴。

于 2013-07-10T19:46:37.823 回答
0

这是你想要的？js小提琴

var text = 'Some text here';
var span$ = $('<span></span>').text(text);
var div$ = $('.dropzone');
var position = div$.position();

$('body').append(span$);


span$.css( {position:'absolute', left:position.left + (div$.width() / 2) - (span$.width() / 2)   , top:position.top + (div$.height() / 2) - span$.height() /2, zIndex:10000, background:'#ffffff'});
于 2013-07-10T19:11:16.070 回答
0

一个可能的解决方案：

$(".dropzone").before("<p>test!</p>");
于 2013-07-10T19:11:21.833 回答