Javascript 当设置为焦点时，如何在缩放模式下使搜索框在网页上可见

当我处于100%缩放模式时，当我将焦点设置为网页上的搜索框时，我可以看到整个搜索框而没有任何问题，但是如果我处于200%缩放模式，并且将焦点设置为搜索框，则我只能看到搜索框的一半。在任何缩放模式下，如何确保用户可以看到整个搜索框

代码：

---

上面是搜索框输入元素代码。我的搜索框位于网页内，无法更改宽度和填充，因为它与其他元素重叠。当它聚焦时，是否有任何方法可以滚动页面，使其完全显示

您需要使用搜索输入字段的框大小和宽度。这里是代码将为您工作，即使在400%缩放

.searchbox{  
box-sizing:border-box;
padding:7px 10px;
width:100%;
}

<input id="searchbox" title="SearchBox" class="searchbox" placeholder="Search...">

---

您可以尝试CSS悬停效果，即在悬停时可以增加输入字段的大小

#searchbox:hover{  
  /* Increase size or padding */
}

---

在任何缩放模式下，您的元素都将被聚焦。

您是否有一个示例URL，其中包含此操作？我的第一反应是不用担心，因为放大控件的用户主要需要查看控件，而不一定要查看整个控件或其周围的内容。您无法访问URL我的搜索框有一个下拉按钮，可以让用户查看选项，在缩放模式下，只有一半的搜索框可见，所以用户无法看到真空中的下拉按钮，因为我看不到它，可能是最大宽度，希望缩放的用户会意识到东西被截断了。@aardrian在堆栈溢出的缩放模式下，只有顶部的搜索框被截断了，当使用选项卡或单击搜索框时，只能看到搜索框的某些部分。在这种情况下，如何使其完全可见？

#searchbox:hover{  
  /* Increase size or padding */
}

$('.elementClass').get(0).scrollIntoView();