使用css和js

时间:2016-08-31 02:41:44

标签: mobile cross-platform frontend

我已经在移动应用中使用了一个特定的前端框架,但我在这里没有提到这个名字,因为它与我的问题无关。我已经尝试了其他竞争对手,但没有人引起我的兴趣。

特别是它们似乎很难用Bootstrap模板进行自定义。 Bootstrap是响应式的,现在首先是移动的,但是它需要额外的库来使其更具原生的外观和感觉。

所以我想,也许我应该尝试与Bootstrap一起工作的小型库。

我正在寻找能够使我的基于网络的Bootstrap应用感觉并且看起来像智能手机/平板电脑本身的库/代码。

在这里,我列出了我认为应该具备的正确行为:

1。快速点击

我已经知道了这个库:Fastclick

2。隐藏的滚动条

也许这个足够了? JS Fiddle

Javascript

var parent = document.getElementById('container1');
var child = document.getElementById('container2');
child.style.paddingRight = child.offsetWidth - child.clientWidth + "px";

CSS

*{margin:0;}
#container1{
    height: 100%;
    width: 100%;
    border: 1px solid green;
    overflow: hidden;
}

#container2{
    width: 100%;
    height: 99%;
    border: 1px solid blue;
    overflow: auto;
    padding-right: 0px; /* exact value is given in JavaScript code */
}

html, body{
    height: 99%;
    border: 1px solid red;
    overflow:hidden;
}

3。禁用缩放

这还够吗?

<meta name="viewport" content="user-scalable=no"/>

或者我应该使用它吗?

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

4。能够包含部分.html页面(用于快速加载,尤其是共享的<head>标记):

Please suggest library or code

如果您认为我应该添加更多行为,请留言。目前,我正在研究这四种行为。

仅供参考,我已经尝试使用AdminLTE(Bootstrap模板)OnsenUI,几乎成功,但滚动条行为很糟糕。 (显示不应该显示的时候,滚动条看起来不是原生的。

0 个答案:

没有答案