HTML5桌面/移动博客 - jQuery UI还是jQuery Mobile?

3

好的,我一直在研究参与游戏开发,并试图保持一个小博客。除了我的学校作业之外,我想找个地方放一些自己工作的教程。我一直在使用Blogger,但是我又开始接触脚本和网站开发,想尝试离开它,只在自己的服务器上创建一些基本的东西。我迷上了HTML5,一直喜欢使用jQuery因为它提供了脚本的简单性。然而,总的来说,我对网站开发还很新手,因为我在学校学的大部分都是关于原生编程的。

我一直在比较jQuery UI库和jQuery Mobile。我有兴趣从头开始创建自己的博客。没有花哨的东西,只是一个发布教程等内容的地方。我相信我有能力迎接这个挑战。但是,除此之外,我通过themeroller应用程序为jQuery UI创建的主题是我唯一确定的。

我希望我的博客在手机/平板电脑上看起来漂亮且运行快速。即使在桌面上也会非常简洁。 使用jQuery UI创建博客并轻松扩展到移动设备上容易吗?还是最好只用jQuery Mobile来适配手机/平板电脑以及桌面,因为我只需要最简单的东西?在jQuery Mobile中能否像使用jQuery UI一样实现近似的自定义和可编程性?

如果有人了解任何良好的解决方案,可以使我将同一个布局扩展到桌面和移动设备上。

1个回答

3

jQuery UI和jQuery Mobile都实际上有主题自定义功能。

jQuery UI - http://jqueryui.com/themeroller/ jQuery Mobile - http://jquerymobile.com/themeroller/index.php

就通用性而言,它完全取决于您。移动浏览器都能运行jQuery UI和Mobile,因此您可以在桌面上选择您熟悉且喜欢的任意一个。

现在来解决布局大小问题:

将相同的布局扩展到桌面和移动设备的最简单方法是使用百分比宽度的流体布局。但是,对于移动设备的尺寸,它很快就会出现偏差。

建议不要仅使用百分比,而是使用媒体查询。这将允许您随着屏幕大小的变化更改CSS,其语法也非常直观和易于使用。

@media screen and (min-width: 600px) and (max-width: 900px) {
  .class {
   background: #333;
  }
}

只要这段代码在你的 CSS 文档底部,就会覆盖任何现有的样式。它的意思是,在屏幕大小在 600 到 900 像素之间时应用此样式。为了测试它,你可以实际缩放浏览器的大小来查看差异。
更多关于媒体查询的内容: http://webdesignerwall.com/tutorials/css3-media-queries 简而言之,jQuery UI 和 Mobile 都可以进行主题设置,使用媒体查询也很重要。

这似乎是一个不错的选择。据我理解,这将覆盖原有设置,因此我甚至可以尝试将其放入我的当前博客 XML 模板中,以便扩展它? - Cory Gross
媒体查询是CSS属性,只要在CSS规则中使用它们,就可以了。如果需要的话,你甚至可以完全在媒体查询中重写CSS规则。 - Aaron Miler

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接