AngularJSでアコーディオン(toggleボタン仕様)のサンプル
クリックできる範囲 テキストが入ります。テキストが入ります。テキストが入ります。テキストが入ります。 <dl class="accordion"> <dt ng-click="flag = !flag">クリックできる範囲</dt> <dd ng-class="{hide: flag}">テキストが入ります。テキストが入ります。テキストが入ります。</dd> </dl> .accordion, .accordion dt, .accordion dd { margin: 0; padding: 0; } .accordion { width: 300px; margin-bottom: 10px; border: 1px solid #CCC; } .accordion dt { padding: 5px 10px; } .accordion dt { background-color:
AngularJSでアコーディオン(toggleボタン仕様)を1分で実装
AngularJSでアコーディオンを実装する場合、jqLiteを使用して実装しようと考える人もいるかもしれないがjqLiteにはslideToggle()が含まれていないためjQueryのように実装することはできない。 ※ちなみにtoggle()もない。（toggleClassはある） https://docs.angularjs.org/api/ng/function/angular.element ng-click,ng-class,CSSアニメーションで実装 ng-clickでクリックの検出および開閉(フラグ)の切り替え、ng-classでCSSクラスの追加・削除、そしてtransitionで開閉のアニメーションを追加すれば簡単に実装できる。 やり方は簡単。まず$scope.flag = false;で初期フラグを設定する。 angular.module('myApp', []) .
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
