如何在 360px - 640px 之间应用媒体查询。这与我的(max-width: 320px)媒体查询重叠。
@media screen and (min-width:360px) and (max-width:640px) and (orientation : landscape)
Run Code Online (Sandbox Code Playgroud)
我有一个问题,我一直在寻找一段时间的答案,但无法让它发挥作用.
我正在寻找一种方法来检查是否选中了一组复选框中的至少一个复选框.让我这么难的原因是这些输入中的每一个都有不同的名称值.我只找到了jQuery验证插件等的答案.这是我的html:
<tr class="formField-checkbox formFieldRequired">
<td class="formLabelHolder"><label for="field129">Group of checkboxes</label></td>
<td class="formFieldHolder">
<input type="checkbox" name="field129[0]" class="formCheckbox required" value="Something1">
<label><span class="formCheckboxLabel">Something1</span></label>
<input type="checkbox" name="field129[1]" class="formCheckbox required" value="Something2">
<label><span class="formCheckboxLabel">Something2</span></label>
<input type="checkbox" name="field129[2]" class="formCheckbox required" value="Something3">
<label><span class="formCheckboxLabel">Something3</span></label>
</td>
</tr>
Run Code Online (Sandbox Code Playgroud)
这是我现在的jQuery:
// Validate all checkboxes
var named = [];
var $requiredCheck = $(this).find('input[type="checkbox"].required');
$($requiredCheck,$formId).each(function() {
// Creates an array with the names of all the different checkbox group.
named[$(this).attr('name')] = true;
});
// Goes through all the names and make sure there's …Run Code Online (Sandbox Code Playgroud) 我只想在我的下拉菜单中创建子菜单...但我找不到解决此问题的代码.
HTML代码:
<nav id='menu'>
<ul>
<li><a class='home' href='/'>Home</a></li>
<li><a class='prett' href='#' title='Menu'>Menu</a>
<ul class='menus'>
<li><a class='prett' href='Dropdown 1' title='Dropdown 1'>Dropdown 1 + Sub Menu</a>
<ul class='submenu'>
<li><a href="#" title="Sub Menu">Sub Menu</a></li>
</ul>
</li>
<li><a href='#' title='Dropdown 2'>Dropdown 2</a></li>
<li><a href='#' title='Dropdown 3'>Dropdown 3</a></li>
</ul>
</li>
</ul>
</nav>
Run Code Online (Sandbox Code Playgroud)
CSS代码:
#menu{background:#343434;color:#eee;height:35px;border-bottom:4px solid #eeeded}
#menu ul,#menu li{margin:0 0;padding:0 0;list-style:none}
#menu ul{height:35px}
#menu li{float:left;display:inline;position:relative;font:bold 12px Arial;text-shadow: 0 -1px 0 #000;border-right: 1px solid #444;border-left: 1px solid #111;text-transform:uppercase}
#menu li:first-child{border-left: none}
#menu a{display:block;line-height:35px;padding:0 14px;text-decoration:none;color:#eee;}
#menu li:hover …Run Code Online (Sandbox Code Playgroud) 我的情况是我已经制作了一个ion-view五页使用的.这些页面通过"tab like"菜单导航,该菜单不使用ion-tabs或类似(不是问题的重点).我现在想为Ionics使用动态值,scroll-delegate但它似乎不起作用.我已经阅读了关于同一主题的其他问题(在SO和Ionic论坛上),但它们是Ionic 1.0.0左右时代的旧主题,并且提供的解决方案在今天不起作用.
我的ion-view模板:
<ion-view>
<ion-content delegate-handle="{{category.id}}" on-scroll="scrollEvent(category.id)">
<h1>{{category.title}}</h1>
</ion-content>
</ion-view>
Run Code Online (Sandbox Code Playgroud)
我的控制器scrollEvent功能:
$scope.scrollEvent = function(category) {
var scrollamount = $ionicScrollDelegate.$getByHandle(category).getScrollPosition().top;
if (scrollamount > 180) {
console.log('scroll amount > 180');
} else {
console.log('scroll amount < 180');
}
};
Run Code Online (Sandbox Code Playgroud)
这会在控制台中显示以下警告:
句柄"12345"的委托找不到delegate-handle ="12345"的相应元素!没有调用getScrollPosition()!可能的原因:如果您立即调用getScrollPosition(),并且您的delegate-handle ="12345"元素是您的控制器的子元素,那么您的元素可能尚未编译.在调用getScrollPosition()时调用$ timeout,然后重试.
我试着给delegate-handle价值$ionicView.enter $ionicView.afterEnter和$ionicView.loaded.我已经给出了10秒等的功能超时,但它没有帮助.
如果我delegate-handle手动设置并运行它,它就可以工作.我需要动态设置它,因为不同的视图应该有自己的delegate-handle能够将它们彼此分开并相应地设置滚动位置等.类别的ID也可能会改变.
Ionic在浏览页面时制作这些"窗格"(缓存它们),以便我可以看到并检查句柄是否正确.
<ion-view nav-view="active" style="opacity: 0.9; transform: translate3d(-33%, 0px, 0px);">
<ion-content delegate-handle="12345" on-scroll="scrollEvent(category.id)">
<h1>Category 12345 …Run Code Online (Sandbox Code Playgroud) 我无法动态清除
<angucomplete-alt
id="auto-clients"
placeholder="Select Client"
pause="100"
selected-object="vm.curClient"
initial-value="vm.client"
local-data="vm.clients"
search-fields="name"
title-field="name"
minlength="1"
input-class="form-control"
match-class="text-info"
/>Run Code Online (Sandbox Code Playgroud)
我可以用某些事件来做function resetFilter() { vm.client = '' };
吗?
我想让渐变背景填充整个页面/正文。这是我尝试过的。它有效,但滚动后它不会拉伸到页面的整个高度。
body {
width: 100%;
height: 100%;
background: #034b52 url(../../themes/images/bg.jpg) no-repeat center fixed;
color: #fff;
}
body:after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: linear-gradient(to bottom, rgba(3, 75, 82, 1) 0%, rgba(3, 75, 82, 0) 100%);
content: '';
z-index: -1;
}
Run Code Online (Sandbox Code Playgroud) css ×3
html ×3
angularjs ×2
checkbox ×1
dropdown ×1
ionic-view ×1
javascript ×1
jquery ×1
submenu ×1
validation ×1