- 鼠標(biāo)移動(dòng)上去址晕，根據(jù)type的不同進(jìn)行切換
- ng-switch 和 ng-swtich-when
<div ng-switch="type">
<div ng-switch-when="html"></div>
<div ng-switch-when="ios"></div>
<div ng-switch-when="java"></div>
<div ng-switch-when="ui"></div>
</div>
- 根據(jù)鼠標(biāo)移動(dòng)上去觸發(fā)的事件對(duì)type進(jìn)行綁定
var app = angular.module('app',[]);
app.controller('wmxController',['$scope',function ($scope) {
//默認(rèn)顯示第一張
$scope.type = "html";
$scope.enter = function (args) {
$scope.type = args;
}
}])
- 鼠標(biāo)移動(dòng)上去，樣式發(fā)生改變
<div class="title">
<ul>
<li ng-mouseenter="enter('html')" ng-class="{cur:type == 'html'}">前端學(xué)院</li>
<li ng-mouseenter="enter('ios')" ng-class="{cur:type == 'ios'}">ios學(xué)院</li>
<li ng-mouseenter="enter('java')" ng-class="{cur:type == 'java'}">java學(xué)院</li>
<li ng-mouseenter="enter('ui')" ng-class="{cur:type == 'ui'}">UI精品學(xué)院</li>
</ul>
</div>
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
