阅读更多

2顶
1踩

开源软件

原创新闻 Ratchet:移动端的Bootstrap

2014-02-26 16:00 by 副主编 wangguo 评论(4) 有46883人浏览
Bootstrap如今是Github上最火的开源项目之一,这是一个用于前端开发的工具包,由Twitter前设计师Mark Otto和Jacob Thornton合作开发。

现在Bootstrap开发团队又带来了一个专门针对移动端的框架——Ratchet,该框架允许你使用简单的HTML、CSS和JS组件来构建移动应用。



Ratchet官网:http://goratchet.com/
Ratchet组件:http://goratchet.com/components/
Ratchet示例:http://goratchet.com/examples/

使用Ratchet创建应用的步骤

  1. 下载Ratchet,通过各个Ratchet组件拼凑出你想要的应用程序界面,可参考基本页面模板示例应用。你可以在应用<head>标签中添加ratchet-theme-ios.css或ratchet-theme-android.css文件来制定应用的平台。
  2. 通过push.js来连接页面,Push.js允许你创建一个看起来像真实应用的原型。
  3. 将应用原型保存到你的手机上。如果是iPhone,可以参考这些方式,对于Android,可以参考这个指南



Ratchet源码https://github.com/twbs/ratchet

关注ITeye官方微博 @ITeye官微,获得更多更新资讯和社区精彩内容。
  • 大小: 21.7 KB
  • 大小: 78.7 KB
2
1
评论 共 4 条 请登录后发表评论
4 楼 xxjjhh100 2014-05-16 11:20
终于找到个相对满意的框架,文件小,非常适合。有兴趣的可以一起学习进步,203757163(扣群)
3 楼 tianzhijie11 2014-03-12 22:02
没有文档啊?
2 楼 jiandingzw 2014-03-08 17:07
简单,布局不错!!!
1 楼 webeasymail 2014-03-03 09:42
组件太少了,自己还需要做很多功能才能用

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 移动端 Web 开发前端知识整理

    文章来源: ... 最近整理的移动端 Web 开发前端知识,不定期更新。 HTML5 可以做什么 拍照 获取地理位置 手势 canvas 绘图和动画(硬件加速) localstorage,本地缓存 HTML5 动画效果 demo ...

  • 移动端技术选型规划

    SUI Mobile是阿里巴巴国际UED前端团队的移动端UI库,主要借鉴Framework7的形态并以此为基础,参考Ratchet、Ionic、Onsen各种不同的思路,强化功能,精简体积,并提供国内最稳定快速的CDN支持。非常轻量,兼容iOS6.0+...

  • 移动端框架收集

    它采用针对移动性能优化的CSS3转换,支持旋转灯箱效果,包含多样的Ratchet UI组件。整个框架使用Zepto(类似jQuery语法的轻量级移动设备js类库),且整合了backbone.js的视图和路由。Junior十分易于使用,且提供...

  • Framework7 - 是一款开源免费的移动端 HTML 框架

    今天首先给大家隆重推荐一款移动端WebApp开发神器:Framework7。当然啦,这篇带有比较强烈的主观意识偏好,并且建立在一个必要的前提之上:你希望快速开发一款移动端的WebApp,但是团队里并没有资深的前端工程师。 ...

  • Web移动端的常用组件库

    Zurb Foundation和Bootstrap一样,也是一款非常知名的css框架。 Foundation 最大的特色是 Mobile first。它对不同终端支持非常好,对内容结构在不同类型设备中的的呈现方式进行了相应的预设。 (js组件依赖Zepto) ...

  • 移动端的常用组件库

    Zurb Foundation和Bootstrap一样,也是一款非常知名的css框架。 Foundation 最大的特色是 Mobile first。它对不同终端支持非常好,对内容结构在不同类型设备中的的呈现方式进行了相应的预设。 (js组件依赖Zepto) ...

  • 闪客工具:Web H5 UI

    10.Ratchet:移动端的Bootstrap 11.类似微软一样的UI风格 除此之外还有很受欢迎的JS框架 1.React js框架 fackbook 推动的库 2.angularjs 中文社区 http://angularjs.cn/ ...

  • 转: 如何挑选适合的前端框架

    如何挑选适合的前端框架 最近几年,前端技术迅猛发展,差不多每年都会冒出一款主流的框架。 每次新开业务线或启动新项目时,是第...在五六年,移动端还没有兴起,我们没有什么选择,就是jQuery。有人会说,jQuery...

  • 移动web开发框架研究

    它采用针对移动性能优化的CSS3转换,支持旋转灯箱效果,包含多样的Ratchet UI组件。整个框架使用Zepto(类似jQuery语法的轻量级移动设备js类库),且整合了backbone.js的视图和路由。Junior十分易于使用,且提供...

  • 去哪儿网前端架构师司徒正美:如何挑选适合的前端框架?

    目前比较出彩的有Foundation、Semantic,Refill、Ratchet。如果只是想运行在平板上,性能问题就不会那么拮据了,我们还可以试试inoic、Sencha Touch, Kendo UI Mobile…… 没有最好,选择最适合自己的 基本...

  • 移动web ui框架集合

    它采用针对移动性能优化的CSS3转换,支持旋转灯箱效果,包含多样的 Ratchet UI组件。整个框架使用Zepto(类似jQuery语法的轻量级移动设备js类库),且整合了backbone.js的视图和路由。 Junior十分易于使用,且提供...

  • 常用1.SchLib

    常用1.SchLib

  • tokenizers-0.26.0.jar中文文档.zip

    # 【tokenizers-***.jar***文档.zip】 中包含: ***文档:【tokenizers-***-javadoc-API文档-中文(简体)版.zip】 jar包下载地址:【tokenizers-***.jar下载地址(官方地址+国内镜像地址).txt】 Maven依赖:【tokenizers-***.jar Maven依赖信息(可用于项目pom.xml).txt】 Gradle依赖:【tokenizers-***.jar Gradle依赖信息(可用于项目build.gradle).txt】 源代码下载地址:【tokenizers-***-sources.jar下载地址(官方地址+国内镜像地址).txt】 # 本文件关键字: tokenizers-***.jar***文档.zip,java,tokenizers-***.jar,ai.djl.huggingface,tokenizers,***,ai.djl.engine.rust,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,djl,huggingface,中文API文档,手册,开发手册,使用手册,参考手册 # 使用方法: 解压 【tokenizers-***.jar***文档.zip】,再解压其中的 【tokenizers-***-javadoc-API文档-中文(简体)版.zip】,双击 【index.html】 文件,即可用浏览器打开、进行查看。 # 特殊说明: ·本文档为人性化翻译,精心制作,请放心使用。 ·只翻译了该翻译的内容,如:注释、说明、描述、用法讲解 等; ·不该翻译的内容保持原样,如:类名、方法名、包名、类型、关键字、代码 等。 # 温馨提示: (1)为了防止解压后路径太长导致浏览器无法打开,推荐在解压时选择“解压到当前文件夹”(放心,自带文件夹,文件不会散落一地); (2)有时,一套Java组件会有多个jar,所以在下载前,请仔细阅读本篇描述,以确保这就是你需要的文件; # Maven依赖: ``` <dependency> <groupId>ai.djl.huggingface</groupId> <artifactId>tokenizers</artifactId> <version>***</version> </dependency> ``` # Gradle依赖: ``` Gradle: implementation group: 'ai.djl.huggingface', name: 'tokenizers', version: '***' Gradle (Short): implementation 'ai.djl.huggingface:tokenizers:***' Gradle (Kotlin): implementation("ai.djl.huggingface:tokenizers:***") ``` # 含有的 Java package(包): ``` ai.djl.engine.rust ai.djl.engine.rust.zoo ai.djl.huggingface.tokenizers ai.djl.huggingface.tokenizers.jni ai.djl.huggingface.translator ai.djl.huggingface.zoo ``` # 含有的 Java class(类): ``` ai.djl.engine.rust.RsEngine ai.djl.engine.rust.RsEngineProvider ai.djl.engine.rust.RsModel ai.djl.engine.rust.RsNDArray ai.djl.engine.rust.RsNDArrayEx ai.djl.engine.rust.RsNDArrayIndexer ai.djl.engine.rust.RsNDManager ai.djl.engine.rust.RsSymbolBlock ai.djl.engine.rust.RustLibrary ai.djl.engine.rust.zoo.RsModelZoo ai.djl.engine.rust.zoo.RsZooProvider ai.djl.huggingface.tokenizers.Encoding ai.djl.huggingface.tokenizers.HuggingFaceTokenizer ai.djl.huggingface.tokenizers.HuggingFaceTokenizer.Builder ai.djl.hu

  • 电力系统PMU优化配置研究——基于MATLAB的多种算法实现与性能比较

    内容概要:本文详细探讨了电力系统中PMU(相量测量单元)的优化配置问题,旨在确保系统完全可观测的同时尽量减少PMU的数量。作者介绍了六种不同的算法,包括模拟退火、图论方法、递归安全N算法等,并通过MATLAB实现了这些算法。通过对IEEE标准测试系统的实验,展示了各种算法在不同规模系统中的表现。文中不仅提供了具体的MATLAB代码实现,还分享了许多实用的经验技巧,如邻域解生成、退火速率设置、拓扑排序等。 适合人群:从事电力系统研究的技术人员、研究生以及对组合优化感兴趣的科研工作者。 使用场景及目标:适用于电力系统状态估计、故障诊断等领域,帮助研究人员和工程师找到最优的PMU配置方案,提高系统的可靠性和经济性。 其他说明:文章强调了在实际应用中需要注意的问题,如变压器支路的影响、节点编号不连续等问题,并推荐了几篇相关领域的经典文献供进一步学习。此外,还提到了一些有趣的发现,如某些中间节点装PMU反而能减少总数。

  • spring-ai-mistral-ai-1.0.0-M5.jar中文文档.zip

    # 压缩文件中包含: 中文文档 jar包下载地址 Maven依赖 Gradle依赖 源代码下载地址 # 本文件关键字: jar中文文档.zip,java,jar包,Maven,第三方jar包,组件,开源组件,第三方组件,Gradle,中文API文档,手册,开发手册,使用手册,参考手册 # 使用方法: 解压最外层zip,再解压其中的zip包,双击 【index.html】 文件,即可用浏览器打开、进行查看。 # 特殊说明: ·本文档为人性化翻译,精心制作,请放心使用。 ·只翻译了该翻译的内容,如:注释、说明、描述、用法讲解 等; ·不该翻译的内容保持原样,如:类名、方法名、包名、类型、关键字、代码 等。 # 温馨提示: (1)为了防止解压后路径太长导致浏览器无法打开,推荐在解压时选择“解压到当前文件夹”(放心,自带文件夹,文件不会散落一地); (2)有时,一套Java组件会有多个jar,所以在下载前,请仔细阅读本篇描述,以确保这就是你需要的文件;

  • 三菱FX1s与台达MS300变频器基于Modbus RTU通讯的实战指南

    内容概要:本文详细介绍了三菱FX1s PLC与台达MS300变频器通过Modbus RTU协议实现通讯的方法。首先,文中列举了所需的硬件设备及其连接方法,确保PLC与变频器能够正常通信。接下来,针对频率设定、频率读取及正反转启停控制三大主要功能进行了详细的编程讲解,提供了具体的梯形图代码示例并解释了每一步的作用。此外,还涉及到了触摸屏(MCGS和威纶通)的配置步骤,使用户可以通过触摸屏方便地操作变频器的各项功能。最后,作者分享了一些实用的小技巧和常见错误避免方法,帮助使用者快速解决问题,提高工作效率。 适合人群:从事自动化控制系统集成的技术人员,尤其是那些需要将三菱PLC与台达变频器进行互联的工程师。 使用场景及目标:适用于工业自动化领域的项目实施过程中,旨在帮助技术人员掌握三菱FX1s与台达MS300变频器之间的高效通信技术,从而更好地完成系统集成任务。 其他说明:文中不仅包含了详细的理论知识和技术要点,还有丰富的实践经验分享,有助于读者全面理解和应用相关技术。同时,提供的完整工程文件可以直接应用于实际项目中,极大地节省了开发时间和成本。

  • winrar免费版压缩工具

    winrar免费版压缩工具

  • 基于CEC21测试函数的灰狼、鲸鱼、人工蜂群优化算法性能对比及Matlab实现

    内容概要:本文详细介绍了灰狼算法(GWO)、鲸鱼算法(WOA)和人工蜂群算法(ABC)在CEC21标准测试函数集上的性能对比。通过设定相同的实验条件(种群数量50,迭代次数500次,30维问题空间),分别探讨了各算法的关键参数调整及其对不同类型函数(单峰、多峰、复合)的影响。文中提供了每个算法的核心代码片段,并针对具体函数给出了优化建议。最终结果显示,GWO在单峰函数上有优势,WOA擅长处理旋转和平移问题,而ABC在高维复杂环境中表现出色。 适合人群:从事优化算法研究的科研人员、研究生以及对智能优化算法感兴趣的开发者。 使用场景及目标:适用于需要评估和比较不同优化算法性能的研究项目,特别是那些涉及高维、多峰、旋转平移等问题的实际应用场景。目标是帮助研究人员选择最适合特定任务的优化算法,并提供参数调优的经验。 其他说明:文章不仅提供了理论分析,还分享了许多实践经验,如参数调整技巧、初始化方法等。此外,所有实验均基于Matlab平台完成,附带完整的代码实现,方便读者复现实验结果。

  • 电控开关.SchLib

    电控开关.SchLib

  • spring-ai-autoconfigure-model-openai-1.0.0-M7.jar中文-英文对照文档.zip

    # 【spring-ai-autoconfigure-model-openai-1.0.0-M7.jar中文-英文对照文档.zip】 中包含: 中文-英文对照文档:【spring-ai-autoconfigure-model-openai-1.0.0-M7-javadoc-API文档-中文(简体)-英语-对照版.zip】 jar包下载地址:【spring-ai-autoconfigure-model-openai-1.0.0-M7.jar下载地址(官方地址+国内镜像地址).txt】 Maven依赖:【spring-ai-autoconfigure-model-openai-1.0.0-M7.jar Maven依赖信息(可用于项目pom.xml).txt】 Gradle依赖:【spring-ai-autoconfigure-model-openai-1.0.0-M7.jar Gradle依赖信息(可用于项目build.gradle).txt】 源代码下载地址:【spring-ai-autoconfigure-model-openai-1.0.0-M7-sources.jar下载地址(官方地址+国内镜像地址).txt】 # 本文件关键字: spring-ai-autoconfigure-model-openai-1.0.0-M7.jar中文-英文对照文档.zip,java,spring-ai-autoconfigure-model-openai-1.0.0-M7.jar,org.springframework.ai,spring-ai-autoconfigure-model-openai,1.0.0-M7,org.springframework.ai.model.openai.autoconfigure,jar包,Maven,第三方jar包,组件,开源组件,第三方

Global site tag (gtag.js) - Google Analytics