0.0.2 • Published 7 years ago
iwe7-hairline v0.0.2
在style.scss中添加样式即可使用
.hairline {
position: relative;
&:before {
content: '';
position: absolute;
display: var(--display);
background-color: var(--color);
z-index: 1;
top: var(--top);
right: var(--right);
bottom: var(--bottom);
left: var(--left);
width: var(--width);
height: var(--height);
transform-origin: var(--originX) var(--originY);
transform: scale(var(--scaleX), var(--scaleY));
box-sizing: border-box;
pointer-events: none;
border: var(--border);
border-radius: var(--borderRadius);
}
}
<div class="h40" [hairline]="hairline" hairlineColor="red">
变
</div>
hairline: string = 'top';
setInterval(() => {
if (this.hairline === 'top') {
this.hairline = 'right';
} else if (this.hairline === 'right') {
this.hairline = 'bottom';
} else if (this.hairline === 'bottom') {
this.hairline = 'left';
} else if (this.hairline === 'left') {
this.hairline = 'all';
} else if (this.hairline === 'all') {
this.hairline = 'none';
} else if (this.hairline === 'none') {
this.hairline = 'top';
}
this._cd.markForCheck();
}, 1000);
属性 | 默认 | 类型 |
---|---|---|
hairline | top | 'string','top','bottom','right','left','all','none' |
hairlineColor | '#efefef' | string |