如何创建可拖动且可调整大小的 JavaScript 弹出窗口？答案

【问题标题】：How do I create a draggable and resizable JavaScript popup window?如何创建可拖动且可调整大小的 JavaScript 弹出窗口？
【发布时间】：2008-08-27 17:45:06
【问题描述】：

我想在 JavaScript 中创建一个可拖动且可调整大小的窗口以供跨浏览器使用，但我想尽量避免使用框架。

有人有我可以使用的链接或代码吗？

【问题讨论】：

为什么不想使用框架？他们将为您节省大量工作。 codinghorror.com/blog/archives/001163.html 编辑：不使用框架是一种选择，但坦率地说，为了获得一个与跨浏览器兼容的良好实现，您可能至少需要花费一两天时间并最终写好几页代码，所有这些都已经为您完成，只需调用一个框架。

标签： javascript dialog

【解决方案1】：

JQuery 更专注于许多不错的实用功能，并使 DOM 操作变得更加容易。基本上，我认为它应该是 Javascript。这是对 Javascript 语言本身非常有用的补充。

ExtJS 是一套带有特定 API 的 GUI 组件...如果您想轻松创建类似的组件，请使用它，否则，请使用更灵活的框架。

【讨论】：

还有jqueryui.com，它允许DOM元素可拖动或可放置。

【解决方案2】：

JQuery 是个不错的选择。并且使用Jquery UI 插件（例如draggable），轻而易举......（这里有一个demo）。

不使用框架来保持“纯粹”，对我来说似乎只是浪费时间。有一些好东西，可以为您节省大量时间，更好地花时间使您的应用程序变得更好。

但是您始终可以查看源代码以获取一些“灵感”，并对其进行调整，而不会产生您不会使用的东西的开销。它做得很好且易于阅读，而且您经常会发现一些您甚至没有想到的跨浏览器技巧。

编辑：哦，如果你真的不想要没有框架，那么只需检查他们的源代码......确保你可以将其中的一些用于你的应用程序。

【讨论】：

【解决方案3】：

有时您无法选择您的环境或架构，因此您会陷入无法使用框架等限制条件中工作...

【讨论】：

【解决方案4】：

完全避免使用框架会给您留下大量代码和一堆乏味的浏览器测试。

如果您考虑一个框架，我建议您使用带有 jqDnR 插件的 jQuery。我认为它会解决您的问题，或者您可以将jQuery draggables 的功能与jQuery resizables 结合起来

【讨论】：

【解决方案5】：

只是想避免为一件非常小的事情向客户端下载大型框架，也许我很愚蠢。

我看过 jQuery，也看过 ExtJS，ExtJS 中的文档和 UI“外观”似乎更加优秀和专业……你们推荐 jQuery 有什么特别的原因吗？

【讨论】：

您可以跳过框架，但是您必须自己编写代码，检测用户是否使用 IE6 并提供同步的 iframe shim 等等。那里有很多示例，但要确保你得到一个处理 IE6 的选择列表。