Question

我一直在做很多关于构建响应式设计的研究。所以我从这里看到了这篇文章：

Is it redundant using jQuery Mobile and a responsive layout /CSS media queries?

它让我思考。响应式设计不会取代制作Jquery Mobile网站吗？因为响应式设计与JQ Mobile完全相同，但更好，因为您可以更好地控制每个区域。纠正我，如果我错了我只是想知道和学习！那么为什么有人想要使用JQuery Mobile甚至使用JQ Mobile和响应式设计？

Answer 1

如果你也支持桌面屏幕，你可能不会使用jquery mobile。对于手机和平板电脑，Jquery mobile更有用。

另一方面，响应式设计使您能够在您的网站上显示信息，并使其可读和可用，而与屏幕大小无关。如果您想支持所有屏幕尺寸，请参阅Twitter Bootstrap。

<强>更新

通常，桌面和移动设备/平板电脑的用户界面不同。因此，根据屏幕大小，您可以决定每个组件（标题，导航栏，侧栏，正文，页脚）将如何在视口中布局以及设计应该如何。

例如，您的网站将为移动设备提供单一列布局，为平板电脑提供2列布局，而不是桌面版。

Answer 2

JQuery Mobile图标可以是您想要的大小，只要它是14px ...

虽然这并非完全正确，但您必须非常了解如何在JQuery Mobile中使用CSS来更改图标的大小，更不用说在媒体查询中更改它们了。

按钮可以包含文字和/或图标。如果桌面PC上有图标和文本的按钮，并且移动设备上只有一个图标，那将会很不错。好吧，这似乎更难，因为按钮的格式是通过给＆lt; button＆gt;提供btn- *类来指定的。（或＆lt; a＆gt;）元素。例如：

<a href="#caddy" class="ui-btn ui-btn-icon-notext ui-corner-all ui-icon-caddy ui-nodisc-icon ui-alt-icon">Caddy</a>

或：

<a href="#order" class="ui-btn-a ui-corner-all ui-btn ui-btn-icon-right ui-icon-carat-r">Checkout</a>

因此，JQuery Mobile为使用CSS做的事情添加了更多约束，从而使构建响应式界面变得更加困难。

Answer 3

如果您的目标是使用屏幕小于桌面的移动和手持设备，最好使用jQuery mobile。

jQuery Mobile的优势在于它为您提供了一些额外的功能，如页面事件，页面转换，主题等。与编写代码以手动执行所有这些功能相比，它更简单，更简单。

此外，jQuery Mobile使用更多流畅的布局，这意味着您的网页适合大多数屏幕尺寸。响应式设计允许您根据屏幕大小显示/隐藏信息。

Answer 4

如果您正在创建响应式设计Web应用程序，我是否可以建议您遵循Mobile-first方法，这基本上意味着您首先设计和构建移动应用程序，而不是在PC版本完成后执行此操作？

以下是文章中的一个例子：

 /*Large screen styles first - Avoid*/
.product-img {
  width: 50%;
  float: left;
}
@media screen and (max-width: 40.5em) {
  .product-img {
    width: auto;
    float: none;
  }
}
/* mobile first approach */
@media screen and (min-width: 40.5em) {
  .product-img {
    width: 50%;
    float: left;
  }
}

通过这种方式，您可能会觉得jQuery mobile在开发过程中是多余的。正如其他人所提到的那样，当你想为移动设备和平板电脑构建一个单独的应用程序时，jQuery mobile会派上用场。

Answer 5

如果你想建立移动网站，那么你必须使用jQuery mobile，如果你想要支持桌面浏览器和移动浏览器，那么你必须使用bootstrap或基础框架来制作响应式网站。

Jquery移动或响应式设计？

5 个答案: