我正在使用materializecss.但我不能让图标工作它说的话,但没有显示图标?
我包括了materializecss和js但仍然没有工作......
有人知道怎么修这个东西吗?
我正在尝试使实体日期选择器可编辑.这是目标,用户可以直接在输入字段中写日期或使用小部件来选择日期.
我做了一些即将在这个jsfiddle上工作的东西.但是我正试图解决一个错误.当用户直接在输入中写入日期时,选择器也需要获取新值(因为我使用不同的格式来提交日期,并且有一个隐藏的输入字段要更新).要做到这一点,我试着这样做
picker.set('select', $(this.val());
Run Code Online (Sandbox Code Playgroud)
但是它会创建一个无限循环,因为实现中的方法set
也会触发change
输入上的事件.
编辑:哦,我刚刚发现在github上存在一个问题.你对解决方法有什么想法吗?
我正在使用materializecss的CDN版本
<html>
<head>
<!-- css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">
</head>
<body>
<!-- page body -->
<!-- scripts -->
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>
<script src="scripts/scripts.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
并在控制台中收到以下错误
未捕获的TypeError:无法读取undefined的属性'swing'
at materialize.min.js:6
(匿名)@ materialize.min.js:6
我有一个使用React和materialize-css的单页Web应用程序,我想将其导出为静态HTML和CSS,以便可以轻松编辑HTML以进行原型设计.是否可以至少导出当前状态的快照?
我在Firefox和Chrome中尝试过"保存页面",但它没有提供良好的效果.
是否可以转换使用bootstrap的网站使用实现CSS?这两个框架之间存在很多重叠,但我想知道引导程序中是否存在实现未命中的任何功能.
是否可以在Materialise中调整导航栏的高度?
64px对我的网站来说有点太多了.在我决定实现之前,我的目标是30px.
大家问候大家!
我有以下代码构建一个基于materialize-css框架的单一单选按钮http://materializecss.com/forms.html#radio
<input name = 'group1'
type = 'radio'
id = 'test2'/>
<label for = 'test2'>Yellow</label>
Run Code Online (Sandbox Code Playgroud)
我尝试使用*ngFor的方法如下所示:
statuses: string[] = [
'Single',
'Married',
'Divorced',
'Common-law',
'Visiting'
];
<p>{{maritalStatus?.status}}</p>
<div *ngFor = 'let status of statuses; let indx = index'>
<input #widget
class = 'with-gap'
name = 'statusGroup'
type = 'radio'
id = 'status'
[value] = 'status'
[(ngModel)] = 'maritalStatus.status'
(change) = 'radioBtnChange$.next(status)'
/>
<label for = 'status'>{{status}}</label>
<p>{{status}}{{ indx}}</p>
</div>
Run Code Online (Sandbox Code Playgroud)
创建所有按钮,但只能选择第一个按钮(单个).
我怎样才能获得按钮系列功能作为单选按钮的功能?
谢谢
正如标题中的解释,我正在尝试将Materialise集成到我的Angular 2项目中.
该项目由" AngularCli " 生成
我正在使用" Webpack "和" Scss "
我找到的tuto都是不同的我不明白如何使用scss:
我的角度cli json:
{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "project": { "name": "accident-chain-web-angular", "ejected": true }, "apps": [ { "root": "src", "outDir": "dist", "assets": [ "assets", "favicon.ico" ], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ "assets/scss/main.scss" ], "scripts": [], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "preprod": "environments/environment.preprod.ts", "prod": "environments/environment.prod.ts" } } ], "e2e": { "protractor": { "config": …
我使用以下代码来找到materializecss网站中的NavBar.
<nav>
<div class="nav-wrapper">
<a href="#!" class="brand-logo">Logo</a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
<ul class="right hide-on-med-and-down">
<li><a href="sass.html">Sass</a></li>
<li><a href="badges.html">Components</a></li>
<li><a href="collapsible.html">Javascript</a></li>
<li><a href="mobile.html">Mobile</a></li>
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-demo">
<li><a href="sass.html">Sass</a></li>
<li><a href="badges.html">Components</a></li>
<li><a href="collapsible.html">Javascript</a></li>
<li><a href="mobile.html">Mobile</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
文档说使用以下JavaScript代码来初始化插件.
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.sidenav');
var instances = M.Sidenav.init(elems, options);
});
Run Code Online (Sandbox Code Playgroud)
但是,当它运行时说
"选项"未定义.
我不想为此目的使用jQuery.我怎样才能解决这个问题?
我正在使用materialize-css在我的React组件中创建一个带有日期选择器的表单。我没有很多字段可以捕获此表单,并且结构相当简单。返回的表单如下所示:
<form onSubmit={this.handleSubmit.bind(this)}>
<div className="container">
<div className="card grey lighten-3">
<div className="card-content black-text">
<span className="card-title">
<input placeholder="Event Name"
name="name" value={this.state.name}
onChange={this.handleStateChange.bind(this)}/>
</span>
<input name="description" placeholder="Description"
value={this.state.description}
onChange={this.handleStateChange.bind(this)}/>
<input name="image" placeholder="Image URL"
value={this.state.image}
onChange={this.handleStateChange.bind(this)}/>
<input placeholder="Start Date"
className="datepicker" name="startDate" value={this.state.startDate}
onSelect={this.handleStateChange.bind(this)}/>
</div>
<div class="card-action">
<div className="row">
<span>
<div className="col s3">
<input className="btn light-blue accent-1" type="submit" value="Submit"/>
</div>
<div className="col s3">
<a className="btn grey" onClick={this.handleExpand.bind(this)}>Cancel</a>
</div>
</span>
</div>
</div>
</div>
</div>
</form>
Run Code Online (Sandbox Code Playgroud)
状态更改通过
handleStateChange(item) {
this.setState({[item.target.name]: item.target.value});
}
Run Code Online (Sandbox Code Playgroud)
我打电话给 …
materialize ×10
javascript ×4
html ×3
angular ×2
css ×2
reactjs ×2
angular-cli ×1
css3 ×1
datepicker ×1
mockups ×1
pickadate ×1
sass ×1
webpack ×1