<div class="content__title">
|
<h1>
|
Dropdown Animations
|
<small>Extends the dropdown effects when open just adding an animation class</small>
|
</h1>
|
</div>
|
<div nz-row [nzGutter]="16">
|
<div nz-col [nzMd]="24">
|
<nz-card nzTitle="Basic">
|
<nz-dropdown class="mr-sm">
|
<a class="ant-dropdown-link" nz-dropdown>
|
Hover me <i class="anticon anticon-down"></i>
|
</a>
|
<ul nz-menu>
|
<li nz-menu-item>1st menu item</li>
|
<li nz-menu-item>2st menu item</li>
|
<li nz-menu-divider></li>
|
<li nz-menu-item [nzDisable]="true">3st menu item</li>
|
<li nz-menu-divider></li>
|
<li nz-submenu>
|
<span title>sub menu</span>
|
<ul>
|
<li nz-menu-item>1rd menu item</li>
|
<li nz-menu-item>2th menu item</li>
|
</ul>
|
</li>
|
</ul>
|
</nz-dropdown>
|
<nz-dropdown-button>
|
DropDown Button
|
<ul nz-menu>
|
<li nz-menu-item>1st menu item</li>
|
<li nz-menu-item>2st menu item</li>
|
</ul>
|
</nz-dropdown-button>
|
</nz-card>
|
</div>
|
</div>
|
<div nz-row [nzGutter]="16">
|
<div nz-col [nzMd]="6" *ngFor="let name of ants">
|
<div class="ant-box">
|
<nz-dropdown [nzTrigger]="'click'">
|
<a class="ant-dropdown-link" nz-dropdown>
|
{{name}} <i class="anticon anticon-down"></i>
|
</a>
|
<ul nz-menu class="animated {{name}}">
|
<li nz-menu-item>1st menu item</li>
|
<li nz-menu-item>2st menu item</li>
|
</ul>
|
</nz-dropdown>
|
</div>
|
</div>
|
</div>
|
