问题标签 [material-design-lite]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
5397 浏览

javascript - 禁用 Material Design Lite 切换开关

我正在尝试使用 JavaScript 在页面上创建一些元素,并使用新的Material Design Lite来修饰它们。这一切都有效,直到我在创建元素后尝试以编程方式开始禁用元素。

我有几个切换开关(由 JavaScript 创建)。当一个人打开时,我希望其他人被禁用。

如果我使用:

它工作得很好而且它被禁用了,但是一旦我像这样尝试它:

toggle2 在视觉上仍然处于活动状态,涟漪效果有效,但不会滑动到 ON,因此它在后台被禁用,只是视觉上没有。

这是一个JSFiddle示例(使用 HTML 元素,但我创建的 JS 元素也是如此)

另外,这里是问题的视频。其中,第三个 down 被禁用,toggle3.disabled = true;第四个被 IF 语句禁用,基于第二个 down 的状态。

我不知道我做错了什么,或者这是 MDL 本身的错误。

谢谢

0 投票
1 回答
379 浏览

material-design-lite - 允许mdl-layout__tab-bar 中的标签充当实际标签

0 投票
1 回答
427 浏览

meteor - 移动网络应用的最佳前端框架

我正在尝试为手机开发一个交互式网络应用程序,我想为最多的手机提供最好的体验。

为此,我决定使用流星,因为它负责处理幕后逻辑的所有繁重工作,但这样的选择是有代价的,在手机上传输的每个 kb 都可能变得昂贵,具体取决于处理器、网络速度、等等

所以现在我正在尝试选择一个非常小的前端框架来帮助以尽可能短的加载时间提供最佳体验。

我们现在有各种解决方案试图解决这个问题,例如 pure.css、min.css、base、materialize、material design lite,但我在选择最佳解决方案时遇到了困难:

  • 我并不总是需要全套功能,所以我应该能够轻松地构建一个子集
  • 我想要以最低成本(重量)获得最佳外观的界面
  • 该软件包应能处理较旧的浏览器(移动世界广阔而激烈)
  • 应该很好地处理小的交互,以提供漂亮的外观和感觉
  • 理想情况下,该软件包的重量最多应为 14kb,以保持良好的体验,而无需在大多数手机和网络上加载时间(或多或少!!!)

到目前为止,我觉得 Material Design lite 是最好的容器,但你怎么看?是否易于自定义(添加社交图标、删除未使用的图标、将效果限制为非常具体的图标)?还有其他框架吗?最好不使用任何框架并从头开始构建界面?不值得努力吗?

0 投票
1 回答
4921 浏览

material-design-lite - material-design-lite 中的“升级”类是做什么的,它是如何设置的?

我正在 React 应用程序中使用 Material-Design-lite 实现 Material Design。当我在顶部组件中使用带有浮动标签的 TextField 时,它可以工作。但是在由顶级组件调用的组件上,它没有。TextField w/Floating Label 然后充当常规输入字段。

我注意到外部 TextField 有一个名为“is-upgraded”的类,但内部 TextField 没有。

应用结构

应用程序.jsx

产品.jsx

myTest.jsx

索引.html

0 投票
2 回答
14311 浏览

material-design-lite - Material Design Lite navigation

How can I make submenu items in the navigation?

I can't use <ul> <li> with it. What is the correct class?

0 投票
3 回答
14757 浏览

material-design-lite - 带表格的 Material Design Lite 网格

我正在试验最近发布的 MDL 工具包,并尝试使用带有卡片和表格的网格布局。

我发现 MDL 网格不如嵌套列的 Bootstrap 网格灵活(可能是因为我对此还不够了解)。因此,在我的 3 列布局中,我并排使用卡片和表格来呈现我拥有的数据。

但不幸的是,除非我手动应用 width=100%,否则卡片不会跨越一列的整个宽度。但是一旦我这样做,表格就没有响应,并且在屏幕尺寸减小时与周围的卡片重叠。

JSFiddle

谁能告诉我如何摆脱这个问题。

0 投票
2 回答
3319 浏览

javascript - 滑动时打开导航抽屉(Material Design Lite)

我正在使用 Material Design Lite 在 Web 视图中为应用程序创建 UI,但是我遇到了一个问题,即我无法在滑动时部署导航抽屉。

我正在使用这个 jquery 代码来识别滑动事件

从这里我不确定如何打开导航抽屉。我希望整个屏幕“可滑动”,尤其是左边缘。触发此滑动处理程序时,如何打开导航栏?

0 投票
6 回答
4884 浏览

html - 如何使图标在 MDL 标题上向左移动?

我尝试设置边距,填充以将后向箭头图标移动到标题左侧,但失败了。我应该如何使这个正确?

0 投票
6 回答
4210 浏览

material-design-lite - 如何在大屏幕上隐藏图标菜单?

我是新手,让我知道如何隐藏菜单图标,它会自动添加而不提示,我只想在小屏幕上显示。对不起英语不好。

谢谢你。

0 投票
2 回答
1254 浏览

material-design-lite - MDL 中是否有可用的 tile 组件?

我在 getmdl.io 上的 MDL 中找不到任何 tile 组件。卡片组件有据可查,但瓷砖组件却没有。