问题标签 [bootstrap-material-design]

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 回答
969 浏览

javascript - 如何仅在单击而不是在页面加载时具有 CSS 动画?

我在我的项目中使用https://github.com/FezVrasta/bootstrap-material-design更具体地说,这个问题的复选框集中在复选框组件上,整个库都在我的项目中使用。

问题是该复选框会在页面加载时触发动画并且看起来很奇怪。LESS 代码是https://github.com/FezVrasta/bootstrap-material-design/blob/master/less/_checkboxes.less#L88,可以在此处查看示例http://codepen.io/anon/pen/ ogmgRX

有谁知道如何停止动画出现在页面加载?

0 投票
1 回答
734 浏览

jquery - select list change selected

I'm using http://fezvrasta.github.io/bootstrap-material-design/#dropdown-menu for my select lists. This generates a dropdown in the form of an ul with list items in it and hides the select list. I thought that when you select a list item in the ul this will select that specific option in the select list. But it doesn't so I'm trying to get this to work.

This is the HTML I'm using:

This will be generated beneath it and hides the above select list:

My jquery that I'm using to select the option in the selectlist:

I get the error:

0 投票
2 回答
1907 浏览

css - 将 LESS 版本的 Bootstrap-Material-Design 集成到 Rails 项目中

我正在使用这个 gem bootstrap-material-design,它是https://github.com/FezVrasta/bootstrap-material-design库的 sass 版本,但最近我注意到不再维护 sass 版本。

我使用这个宝石面临的问题是它不会将按钮和闪烁消息转换为材质样式。

此处建议的一种解决方案: https ://github.com/FezVrasta/bootstrap-material-design/issues/535是使用 LESS 版本,但我不知道如何集成此库的 LESS 版本。有人已经这样做了吗?

更新

如果有人希望在不使用任何框架或服务器端语言(如 Ruby、PHP 等)的情况下将 Bootstrap-Material-Design 添加到他们的网站,只需使用 HTML5、CSS3 和 JS。他们可以按照以下说明进行操作:

安装和下载 bootstrap-material 文件夹

bower install bootstrap-material-design

在 head 标签下链接 bootstrap css 和 material css 缩小文件

链接 Javascript 文件

最后,您必须在身体底部使用此脚本初始化一些材质组件

0 投票
1 回答
3681 浏览

twitter-bootstrap - 引导材料设计和 Aurelia

我已经为此工作了一段时间,但我无法让它工作,我正准备把电脑扔出窗外!

使用 Aurelia 的骨架导航安装bootstrap-material- desing 使用 jspm install bootstrap-material。然后将其作为导入添加到您的 app.js 中的引导程序下方

css 和 js 导入正常,但初始化 js 是问题所在。您通过调用 $.material.init() 对其进行初始化,此代码添加了涟漪效果,因此当您单击按钮时,您会看到涟漪或波浪动画,这就是问题所在,让 $.material.init() 在 Aurelia 中正确工作

1)在 gitter 上获得一些帮助后,您可以使用 attach() 回调来运行此代码,但这仅适用于每个类,因此我必须添加每个页面/类

作为上述 gitter 上有人建议使用路由器管道来调用它的替代方案,我尝试了这个,但仍然无法在每个页面上加载它,当按照我这样添加的文档将它添加到管道时

然后

这部分工作,如果你点击导航链接,那么你会得到涟漪效应,但尝试点击提交按钮没有涟漪效应,所以它似乎不适用于每个类,而只是路由器,我猜

另一个问题是bs材质的另一个效果,你可以在一个名为的输入控件中添加一个css类

floating-label

,然后当您单击输入控件时,占位符文本向上移动,然后在失去焦点时它又向下移动,但是使用 Aurelia 您可以看到占位符文本已经向上移动。如果您删除 value.bind,即删除,value.bind="firstName"则占位符会在 onfocus 和 lostfocus 上进行动画处理,因此 value.bind 会发生干扰。

让这个材料设计 jquery 插件这样简单的东西工作起来并不难,我什至还没有尝试与 Aurelia 交互,我只是希望它像你通过脚本将它添加到普通的 html 页面一样工作标签。我知道是我还不了解 Aurelia。

让这项工作得到任何帮助都会很棒。

当前 app.js 尝试使用管道方法

欢迎.html

0 投票
1 回答
1529 浏览

jquery - Jquery .val() 不能与 Material Design Bootstrap 一起正常工作

我正在使用 Material Design Bootstrap 对输入占位符进行样式设置并做一些不错的事情。

但是,如果我尝试使用 jquery 在输入中添加/更改一些文本,它就无法正常工作。

我正在使用浮动标签,从顶部第二个@here

有人可以告诉我出了什么问题,或者我该如何解决?

这是有问题的图像:

这是有问题的图像

0 投票
1 回答
753 浏览

javascript - Bootstrap 材料设计 - 波纹未显示在弹出窗口中

我正在使用引导材料设计:https ://fezvrasta.github.io/bootstrap-material-design/bootstrap-elements.html

这包括在按下按钮时产生整洁的涟漪效应,这在我的页面中的任何地方都有效,除了在 html 中具有 display:none 但使用 javascript 对用户可见的弹出框 div 中。

HTML:

JS:

如果我取出 style="display:none",涟漪效果会起作用,但包含它会使涟漪效果不适用于 div 内的按钮,真的很奇怪。有什么办法让我保持显示:无(因为弹出框的工作方式就像我想要的那样),但仍然对 div 中的按钮产生涟漪效应?

0 投票
0 回答
1153 浏览

angularjs - 角材料与引导材料

我正在制作一个小型测试应用程序。我想在材料设计上做它,而不是我有三个选项角材料,引导材料和物化。Bootstrap 材料比任何其他材料都简单,但不如 Angular 材料(根据特征进行比较时),但与 Angular 材料相比太容易了。虽然引导材料使用传统的响应式设计方法,但角度材料使用 flex(许多浏览器不支持),并且此应用程序将在浏览器较旧的印度的学校和拼贴画中上线?所以我想要专家对这个问题的比较和审查,我应该使用哪个,还想知道一些关于角度材料的好资源

如何在一行中从角度材料的 css 和 js 中删除布局代码,以便我可以为此目的使用引导程序?

0 投票
1 回答
2675 浏览

javascript - 如何使用 jQuery 从 cookie 中的选择中保存值?

首先,我使用jquery.cookieBootstrap 材料设计。我从选择中保存 cookie 值时遇到问题。

我希望该用户可以在我的函数中选择刷新时间,但我不知道如何保存用户在 cookie 中选择的内容。始终显示在 cookie 的首位。

0 投票
2 回答
1078 浏览

html - 如何覆盖 Bootstrap Material Design 主题的背景?

我已经使用 bootstrap 建立了一个网站,现在我想将Bootstrap Material Design 主题用于它的性感组件。所以我在我的 .js 中包含了 css 和 js <head>,这立即改变了我网站中的很多东西,比如背景和导航栏。

不幸的是,我不想使用主题的背景或导航栏。有人知道我如何覆盖或“禁用”主题的导航栏和背景吗?

欢迎所有提示!

0 投票
2 回答
804 浏览

html - 如何选择 Bootstrap Material 主题的“默认”导航栏?

我正在为网站使用Bootstrap 材料设计模板。它有三个不同颜色的导航栏,我想使用最后一个。但我不确定如何使用最后一个。我是否需要手动更改导航栏的颜色,或者我可以在某处更改一件事,以便所有按钮和单选按钮的颜色也会改变?

我在 github 页面上找到了一篇文章,它指出了如何将原色更改为自定义颜色。但我不希望这样,我只想使用您在此处的第三个导航栏选项中看到的蓝色。

任何想法我该怎么做?欢迎所有提示!