javascript - 如何在用户点击时更改移动搜索栏的位置

Question

我正在从事一个使用 Angular 开发的搜索引擎的开源元素。对于较小的屏幕尺寸，搜索栏的位置在中间，一旦用户点击它就会隐藏在键盘终端后面。任何人都请告诉如何检测此事件并更改搜索栏的位置。

Answer 1

您可以使用 CSS 绑定(bind)自定义或点击事件以动态更改位置。

或者你可以像这样使用 ngStyle

    <button class="my-btn" [ngStyle]="setStyles()">Call to Action</button>



setStyles() {
    let styles = {
        // CSS property names
        'font-style':  this.someProperty ? 'italic' : 'normal',     // italic
        'font-weight': this.anotherProperty ? 'bold'   : 'normal',  // normal
    };
    return styles;
}