我怎样才能使谷歌Chrome开发工具宽度与window.innerWidth相同PS:window.screen.width解决了我的问题
window.innerWidth
window.screen.width
r8uurelv1#
我遇到了同样的问题.....我有一个js函数,它可以设计和排列元素....它在加载和调整大小时有2event监听器.....在桌面模式下,加载和调整大小都很好.....但是当我从开发工具切换到移动的类型时,所有使用innerWidth作为变量的元素都会受到干扰.....这主要是因为我没有“不要将图像的宽度设置为其容器的100%,这允许图像保持其原始大小并溢出innerWidth ....尝试在加载js之前找到溢出视口宽度的元素.....如果您设置的div的宽度高于设备宽度,innerWidth属性会受到干扰.....但只有在移动的模式devtools桌面模式工作正常,我想知道这个问题是否与chrome devtools有关,或者移动设备真的会得到错误的innerwidth值...在检查导致问题的元素后,你可以直接从html css调整它的宽度,或者在开始使用innerwidth属性之前用js设置它的宽度...这样的问题让我困惑,让我想启动自动测试,因为它出乎意料,因为我经常使用innerwidth ... PS:屏幕宽度将解决你的问题,但它总是得到屏幕大小,而不是视口大小...对于手机和平板电脑,这将工作得很好,因为他们总是全屏,但对于桌面,这将不工作,当你调整浏览器窗口...也许有一天,平板电脑和大型手机将允许用户调整屏幕大小
ua4mk5z42#
您应该创建一个泛型函数。
function paginate(array, page_size, page_number) { return array.slice((page_number - 1) * page_size, page_number * page_size); }
每当你的屏幕大小改变时调用这个函数。2首先,试着得到相应的数据,然后用CSS修复UI。
2条答案
按热度按时间r8uurelv1#
我遇到了同样的问题.....我有一个js函数,它可以设计和排列元素....它在加载和调整大小时有2event监听器.....在桌面模式下,加载和调整大小都很好.....但是当我从开发工具切换到移动的类型时,所有使用innerWidth作为变量的元素都会受到干扰.....这主要是因为我没有“不要将图像的宽度设置为其容器的100%,这允许图像保持其原始大小并溢出innerWidth ....尝试在加载js之前找到溢出视口宽度的元素.....如果您设置的div的宽度高于设备宽度,innerWidth属性会受到干扰.....但只有在移动的模式devtools桌面模式工作正常,我想知道这个问题是否与chrome devtools有关,或者移动设备真的会得到错误的innerwidth值...在检查导致问题的元素后,你可以直接从html css调整它的宽度,或者在开始使用innerwidth属性之前用js设置它的宽度...这样的问题让我困惑,让我想启动自动测试,因为它出乎意料,因为我经常使用innerwidth ... PS:屏幕宽度将解决你的问题,但它总是得到屏幕大小,而不是视口大小...对于手机和平板电脑,这将工作得很好,因为他们总是全屏,但对于桌面,这将不工作,当你调整浏览器窗口...也许有一天,平板电脑和大型手机将允许用户调整屏幕大小
ua4mk5z42#
您应该创建一个泛型函数。
每当你的屏幕大小改变时调用这个函数。2首先,试着得到相应的数据,然后用CSS修复UI。