我试图实现一个只有在用户登录时才能看到的下拉列表.下拉列表在"if"语句之外但不在内部时工作.显示按钮"Foo"和下拉按钮,但它不会"下拉".
了header.html
<!-- Header -->
<template name="header">
<nav>
<div class="nav-wrapper">
<a class="brand-logo" href="{{pathFor 'home'}}">Logo</a>
<ul id="nav-mobile" class="right hide-on-med-and-down">
{{#if currentUser}}
<!-- dropdown1 trigger -->
<li>
<a class="dropdown-button" href="#!" data-activates="dropdown1">
<i class="mdi-navigation-more-vert"></i>
</a>
</li>
<li><a href="#">Foo</a></li>
{{else}}
<li><a href="{{pathFor 'signin'}}">Sign in</a></li>
{{/if}}
<li><a href="{{pathFor 'about'}}">About</a></li>
</ul>
</div>
</nav>
<!-- dropdown1 structure -->
<ul id="dropdown1" class="dropdown-content">
<li class="signout"><a href="#!">Sign out</a></li>
</ul>
</template>
header.js
Template.header.rendered = function () {
$(".dropdown-button").dropdown({
belowOrigin: true // Displays dropdown below the button
});
};
可能是什么问题呢？
当我在这里为Materialise应用粘滞页脚显示的css属性时,我的主要元素的高度最高可达33000px.页脚显示正常,但高于空白(可能是长度约33000像素).元素使用标题正确排列,然后是主元素,然后是页脚元素.
HTML:
<body>
<header>
Header stuff
</header>
<main>
Main stuff
</main>
<footer>
Footer stuff
</footer>
</body>
青菜:
body
display: flex
min-height: 100vh
flex-direction: column
main
flex: 1 1 auto
我正在尝试使用NetBeans 8制作Java Swing应用程序，我想知道是否有任何可能的方法可以将物化效果应用于Java Swing应用程序。我已经使用了materializecss框架来制作基于Web的应用程序，并且已经搜索了Google以找到结果，但是没有一个包含“ materialize”和“ swing”关键字。
所以我在尝试用@ Html.CheckBoxFor实现materializecss'复选框时遇到了问题.如果我完全输入:
<input type="checkbox" id="test5" />
<label for="test5">Red</label>
有用.但如果我试试这个:
@Html.LabelFor(m => m.RememberMe, new { @class = "login-label" })
@Html.CheckBoxFor(m => m.RememberMe, new { @type = "checkbox" })
复选框从页面左侧消失(复选框的样式左侧设置为-99999).
有没有其他方法可以实现CheckBoxFor,这将使materialise合作？
我materializecss在我的网络应用程序中第一次使用,我正在努力使用datepicker.它根本不起作用.
我导入了materialize.css和js文件并使用了代码
<div>
<input type="date" class="datepicker" />
</div>
并添加了脚本代码
$(document).ready(function() {
$('select').material_select();
window.picker = $('.datepicker').pickadate({
selectYears: 16, // Creates a dropdown of 15 years to control year
format: 'yyyy-mm-dd'
});
});
但没有任何效果,它显示一个禁用的文本框.
另外我想知道如何添加timepicker materializecss？
我正在使用MaterializeCSS（http://materializecss.com/）建立我的网站
我想知道如何手动触发某些控件的波动效果，例如：
“触发某些按钮的波动/波纹效果。”
MaterializeCSS团队认为他们使用的是“ Waves.js” JavaScript库的端口（http://fian.my.id/Waves/），但是当我尝试使用这些命令时，浏览器控制台中会出现错误。
有人可以在这里指出我吗？
代码用作示例：
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--Import materialize.css-->
<link type="text/css" rel="stylesheet" href="css/materialize.css" media="screen,projection"/>
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<!--Import jQuery before materialize.js-->
<script type="text/javascript" src="jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/materialize.min.js"></script>
<title>My website title</title>
</head>
<body>
<script type="text/javascript">
$(document).ready(function() {
Waves.ripple('#but_1');
});
</script>
<a id="but_1" class="waves-effect waves-light btn">button</a>
</body>
</html>
根据MaterializeCSS TEAM ...
“ Waves是我们包含在Materialize中的外部库，可让我们创建Material Design中概述的墨水效果”
...并根据Waves文档....
Waves.ripple（elements，options）以编程方式在HTML元素中创建波纹效果。
我在这个网站上看到了几个相关的问题,但所有这些问题似乎都是由选择器问题引起的,但我认为这不是问题所在.
就我而言,谷歌浏览器和Safari都告诉我有a问题的标签的计算样式text-decoration:none.
选择a标签和设置text-decoration:none没有任何区别,因为他们已经拥有text-decoration:none.
该页面的样式来自几个不同的样式表,包括一个来自我的博客主题,一个来自Materialize框架的命名空间导入,最后一个用户定义的样式表,我留空(因此我没有在这篇文章中包含CSS).
演示: http ://codepen.io/prashcr/pen/RaBKGY
这是HTML:
<body class="site animated fade-in-down">
<div class="site-wrap center">
<div class="post p2 p-responsive wrap" role="main">
<div class="measure">
<div class="mcss">
<div class="container">
<div class="row">
<div class="col s12 m7">
<div class="card">
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="http://materializecss.com/images/office.jpg">
</div>
<div class="card-content">
<span class="card-title activator grey-text text-darken-4">
Kanban<i class="material-icons right">more_vert</i>
</span>
<p><a href="#!">This is a link</a></p>
</div>
<div class="card-action">
<a href="#">This …我刚开始使用angular2 materialize,CSS组件工作正常.但是,当我包含需要初始化的组件(例如select)时,我不知道如何或在何处执行此操作.
这是我的表格的片段:
<div class="input-field col s12">
<select>
<option value="" disabled selected>Choose your option</option>
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
</select>
<label>Materialize Select</label>
</div>
我的组件看起来像这样:
import {Component, ElementRef, Inject, OnInit} from '@angular/core';
import {MaterializeDirective} from "angular2-materialize";
declare var jQuery:any;
@Component({
selector: 'bsi-signup',
styleUrls: ['assets/styles/app.component.css'],
templateUrl: 'assets/templates/signup.component.html',
directives: [MaterializeDirective],
providers: []
})
export class SignupComponent implements OnInit {
elementRef: ElementRef;
constructor(@Inject(ElementRef) elementRef: ElementRef) {
this.elementRef = elementRef;
}
ngOnInit() {
jQuery(this.elementRef.nativeElement).find('select:not([multiple])').material_select();
}
}
我正在使用此处的范围滑块:http://materializecss.com/forms.html
<link href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/js/materialize.js"></script>
<form action="#">
<p class="range-field">
<input type="range" id="test5" min="0" max="100" />
</p>
</form>我设法改变了当你点击滑块时弹出的"拇指"的颜色:
input[type=range]+.thumb{
background-color: #400090;
}
通常我可以检查chrome上的元素并获取我必须更改的类以更改其颜色.由于某些原因,我无法弄清楚如何检查滑块中的"点"以找到我必须添加的类以更改其颜色.
我正在开发具有身份登录名的.NET核心应用程序，该应用程序在/ Identity / Account / Login页面中提供了Bootstrap表单。
我已经在wwwroot / lib文件夹中导入了Materialise CSS文件，并且还希望通过materialize CSS更改“登录”页面的设计。
问题是项目结构中不存在/ Identity / Account / Login页面。那我该如何解决这个问题呢？
materialize ×10
css ×3
javascript ×2
.net-core ×1
angular ×1
asp.net ×1
asp.net-core ×1
datepicker ×1
flexbox ×1
html ×1
html5 ×1
iron-router ×1
java ×1
material ×1
meteor ×1
netbeans-8 ×1
razor ×1
ripple ×1
swing ×1
typescript ×1
wave ×1