我可以将 bootstrap 3 与 jQuery Mobile 一起使用吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18636919/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 22:05:42  来源:igfitidea点击:

Can I use bootstrap 3 together with jQuery Mobile?

javascriptjquerycssjquery-mobiletwitter-bootstrap

提问by Tillito

I have read many "bootstrap vs. jQuery mobile" articles. It is quite clear that they both have different aims. So what about combining them?

我读过很多“bootstrap vs. jQuery mobile”的文章。很明显,他们都有不同的目标。那么如何将它们结合起来呢?

Besides other, I like the responsive layout features of bootstrap. On the other hand I also like the "page" approach and the possibilities of jQuery mobile (including swipe events etc.) and transitions.

除此之外,我喜欢 bootstrap 的响应式布局功能。另一方面,我也喜欢“页面”方法以及 jQuery mobile(包括滑动事件等)和转换的可能性。

Are there professional projects combining both? Or anybody tried to do so and failed?

是否有结合两者的专业项目?或者有人试图这样做但失败了?

I know Using Bootstrap with jQuery Mobilelooks like a similar question but it is outdated (refering to bootstrap 2).

我知道Using Bootstrap with jQuery Mobile看起来像一个类似的问题,但它已经过时了(参考 bootstrap 2)。

回答by glimmer

ConclusionI would not recommend combining JQuery Mobile and Bootstrap for complex projects.

结论对于复杂的项目,我不建议将 JQuery Mobile 和 Bootstrap 结合使用。

JQM KnowledgeWe are building a series of sophisticated web application all using the JQuery Mobile (JQM) Framework. We have spent over a year producing this and now have pretty reasonable knowledge of JQM.

JQM 知识我们正在使用 JQuery Mobile (JQM) 框架构建一系列复杂的 Web 应用程序。我们花了一年多的时间来制作这个,现在对 JQM 有了相当合理的了解。

Positives: Some of the features are useful such as persistent footers and the mobile friendly components which give the HTML5 app a pretty native feel. Negatives: We have had to disable quite a lot of features of JQM such as preloading pages to create the complex functionality we required.

优点:一些功能非常有用,例如持久的页脚和移动友好的组件,它们为 HTML5 应用程序提供了一种非常原生的感觉。缺点:我们不得不禁用 JQM 的许多功能,例如预加载页面以创建我们所需的复杂功能。

The end result is good as we have fooled iOS developers into thinking it was native.

最终结果很好,因为我们已经欺骗了 iOS 开发人员,认为它是原生的。

Bootstrap KnowledgeI have also recently produced a responsive website using bootstrap to advertise the above JQM product and that has worked out very well (http://www.sure-sense.com).

Bootstrap 知识我最近还使用 bootstrap 制作了一个响应式网站来宣传上述 JQM 产品,并且效果很好(http://www.sure-sense.com)。

The ComboI tried to combine the bootstrap with the JQM project on a dashboard application but that has quickly highlighted that the 2 frameworks are not compatible. The CSS of JQM marks up the components on top of the bootstrap CSS and the results are some components looking like JQM and others like bootstrap.

Combo我尝试将引导程序与仪表板应用程序上的 JQM 项目结合起来,但这很快就凸显了这两个框架不兼容。JQM 的 CSS 标记了引导程序 CSS 之上的组件,结果是一些组件看起来像 JQM,而其他组件看起来像引导程序。

回答by Kim T

Personally I think jQuery Mobile has more features than you really need, also it locks you into a way of building which isn't flexible. It starts to get buggy and messy when you have many panels with different animations and usually gets you 80% of the way very quickly, but then takes a long time to do custom things.

就我个人而言,我认为 jQuery Mobile 的功能比您真正需要的要多,而且它会将您锁定在一种不灵活的构建方式中。当您有许多具有不同动画的面板时,它开始变得有问题和混乱,并且通常很快就能完成 80%,但随后需要很长时间来做自定义的事情。

I would use twitter bootstrap and then add plugins to support features you need.

我会使用 twitter bootstrap,然后添加插件来支持您需要的功能。

Bootstrap has lots of unofficial plugins you can add to imitate the functionality of jQuery Mobile: http://bootsnipp.com/resources

Bootstrap 有很多非官方的插件,你可以添加来模仿 jQuery Mobile 的功能:http: //bootsnipp.com/resources

there is a guide here to use the swipe events from jQuery Mobile only: http://lazcreative.com/blog/adding-swipe-support-to-bootstrap-carousel-3-0/

这里有一个指南,可以使用仅来自 jQuery Mobile 的滑动事件:http: //lazcreative.com/blog/adding-swipe-support-to-bootstrap-carousel-3-0/

Or you can use your own plugin to manually add the swipe events: http://stephband.info/jquery.event.swipe/

或者您可以使用您自己的插件手动添加滑动事件:http: //stephband.info/jquery.event.swipe/

If you want an expandable sidebar menu you can easily add it yourself:

如果您想要一个可扩展的侧边栏菜单,您可以自己轻松添加:

-webkit-transition: width 0.35s ease;
-moz-transition: width 0.35s ease;
-o-transition: width 0.35s ease;
transition: width 0.35s ease;

http://jsfiddle.net/Osis/Mns8q/http://codepen.io/krichnafsky/pen/cuhkLhttp://coding.smashingmagazine.com/2013/01/15/off-canvas-navigation-for-responsive-website/

http://jsfiddle.net/Osis/Mns8q/ http://codepen.io/krichnafsky/pen/cuhkL http://coding.smashingmagazine.com/2013/01/15/off-canvas-navigation-for-responsive -网站/

回答by Scott Chu

For one-person work, I don't think it really matters what single solution or combo to be chosen since it's all you and the very only "you" to make them work.

对于一个人的工作,我认为选择哪种单一的解决方案或组合并不重要,因为只有你和唯一的“你”才能让它们工作。

However, for a team work piece, in a company or even an enterprise, the work contains Making template + Implementing applcation and the responsiblilities go to creative design team and IT team, respectively. So the final solution need to be OK with both these 2 teams.

但是,对于一个团队作品,在公司甚至企业中,工作包含制作模板+实施应用程序,分别由创意设计团队和IT团队负责。所以最终的解决方案需要对这两个团队都好。

For our company, CD team tends to use BootStrap cause they are requested to make many custom, special-effect web templates, however IT team already did some jQM applcation and they like to use it for future development work, thus a conflict.

对于我们公司来说,CD团队倾向于使用BootStrap,因为他们被要求制作很多自定义的、特效的网页模板,但是IT团队已经做了一些jQM应用,他们喜欢在以后的开发工作中使用它,因此产生了冲突。

In the long run, "User requirement" overcomes the conflict and we are now going to use BootStrap template and trying to avoid using jQM in our main mobile web applicaton development, at best.

从长远来看,“用户需求”克服了冲突,我们现在将使用 BootStrap 模板,并尽量避免在我们的主要移动 Web 应用程序开发中使用 jQM。

A pitty but need-to-accept choice.

一个微不足道但需要接受的选择。