当前位置：文江博客话题详情

如何一次性创建一个可调整大小并调整其大小的对象？（以编程方式开始调整大小）

发布于 2024-10-02 11:59:30 字数 181 浏览 5 评论 0原文

我正在尝试在鼠标位置创建一个可调整大小的 div 并立即将其调整为所需的大小。到目前为止我失败的尝试：

http://jsfiddle.net/YKnfR/1/

关于如何做的任何想法实现这种行为？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

黑凤梨 2024-10-09 11:59:30

将其添加到 #block1 选择器上方的 CSS 中：

#blocks > div
{
    width: 200px;
    height: 200px;
}

除非您希望用户调整大小，否则无需获取可调整大小的脚本。仅供参考，使用像这样的 :not 选择器，CSS 会更清晰：

#blocks > div:not(#block1)
{
    width: 200px;
    height: 200px;
}

但 IE 不支持 :not，而且我不确定它的降级程度如何。这就是为什么您需要将第一个示例放在 #block1 选择器上方。

Add this to your CSS above your #block1 selector:

#blocks > div
{
    width: 200px;
    height: 200px;
}

No need to get the resizable script involved until you want the user to resize it. Just FYI, that CSS would be clearer with a :not selector like this:

#blocks > div:not(#block1)
{
    width: 200px;
    height: 200px;
}

but IE doesn't support :not, and I'm not sure how well it degrades. That's why you need to put the first example above your #block1 selector.

回复收藏 0 原文

冰魂雪魄 2024-10-09 11:59:30

您只需使用 height() 和 width() 添加所需的大小和宽度：

$(document).mousedown(function(e){
    var block = $('<div id="new">New</div>')

    $('#blocks').append(block)
    block.css('left', e.pageX).css('top', e.pageY).resizable()

    block.height('40');
    block.width('40');
})

或者，您可以将这些设置直接放入 css 中。

You just have to add the desired size and width using heigth() and width():

$(document).mousedown(function(e){
    var block = $('<div id="new">New</div>')

    $('#blocks').append(block)
    block.css('left', e.pageX).css('top', e.pageY).resizable()

    block.height('40');
    block.width('40');
})

Alternatively, you can place those settings right into the css.

回复收藏 0 原文

~没有更多了~