如何在Opera中获得元素的计算宽度?在其他浏览器中,我可以这样做:
// getComputedStyle wrapper
function getStyle(element, styleProp) {
return element.currentStyle ? element.currentStyle[styleProp] :
getComputedStyle(element, null).getPropertyValue(styleProp);
}
Run Code Online (Sandbox Code Playgroud)
......但这只适用于Opera.它为很多东西返回"auto"而不是有用的像素值.
这是一个现场演示,可以扩展一些文本以适应盒子.它不适用于Opera,因为计算的宽度auto不是px其他浏览器中的值.

如何在Opera中获得更多有用的计算样式,例如元素的像素宽度?
在这种情况下,我意识到我可以使用offsetWidth而不是获取计算的样式.我很欣赏这个建议,但这个问题的真正意义在于我想知道如何在Opera中获得计算样式,其中样式实际上以单位计算.我不关心offsetWidth这个问题的目的.
我有以下HTML:
<div class='box'>text</div>?
Run Code Online (Sandbox Code Playgroud)
和CSS:
.box {
/* non-essential */
display: inline-block;
margin: 2em;
background: plum;
/* ESSENTIAL */
transform: rotate(45deg);
font-family: Courier;
}?
Run Code Online (Sandbox Code Playgroud)
而这就是小提琴.我在这里省略了前缀,但它们在小提琴中.
预期结果:

这也是我在Chrome,Firefox,IE9,Safari中获得的结果.
但是,在Opera中它看起来像这样:

那么为什么会发生这种情况以及我有其他解决方案呢?
如果这有帮助:

如果没有为Chrome,Firefox和Opera 安装扩展程序,
我想在我们的网站上显示自定义栏(通知如:安装我们的插件.).如果安装了扩展,则不会显示任何内容.
这个想法是:
1.用户访问我们的网站和一个显示消息的栏 - "嘿,安装我们的扩展".
2.安装用户点击安装和扩展.用户无需打开它.
3.用户再次访问我们的网站,并且在安装扩展程序后,该栏不会再次出现.
我们只讨论安装检查,而不是cookie.
到目前为止,我只能为Chrome找到解决方案:http://blog.kotowicz.net/2012/02/intro-to-chrome-addons-hacking.html
和Firefox:http://webdevwonders.com/detecting- firefox-add-ons /
Opera从未被提及过.
有没有办法为Opera做到这一点,基于检查扩展的一部分的本地资源的想法:
chrome-extension:// - 扩展ID - /blank.gif
Firefox chrome:// firebug /内容/ blank.gif
或者: 有没有一种简单的方法可以检查Chrome,Firefox和Opera是否安装了扩展程序?
在这个问题中 - 如果工作人员和社区不介意 - 我想解决不同浏览器的两个不同的错误,虽然在相同条件下出现.
当一个元素display:inline(和a box-shadow,但这里设置更多用于演示目的)得到opacity小于1 时,就会发生错误.然后
用于演示此问题的HTML:
<span class="inline opaque">
<span>Some text.</span>
</span>
Run Code Online (Sandbox Code Playgroud)
CSS:
.inline{
display:inline;
background:red;
box-shadow:0 0 0 10px red;
}
.inline.opaque{
opacity:.5;
}
Run Code Online (Sandbox Code Playgroud)
一个现实的例子.我对这种情况感到非常沮丧.对我来说似乎很奇怪和不自然.非常感谢任何帮助.
谢谢!
更新.似乎我找到了IE的一些解决方法.事实证明,我们可以将它box-shadow移到左边和顶部(它没有在这个bug中裁剪的方向).并且为了使元素在视觉上占据相同的空间,transform可以应用a.这里更好看
@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){
.block{
-ms-transform:translate(5px, 5px);
transform:translate(5px, 5px);
}
.inline{
box-shadow:-5px -5px 0 5px #c0c;
}
}
Run Code Online (Sandbox Code Playgroud)
注意,我们需要移动(可能还有translate)内容.inline.
我正在处理具有以下标记的页面:
<img
alt=""
src="/banner_home.300x200.jpg"
srcset="/banner_home.300x200.jpg 320w,
/banner_home.600x400.jpg 480w,
/banner_home.728x242.jpg 768w,
/banner_home.920x306.jpg 960w,
/banner_home.1234x400.jpg 1280w">
Run Code Online (Sandbox Code Playgroud)
而且似乎在最新的Chrome和Opera中,他们忽略了屏幕大小,只输出最后列出的文件(所以我的情况下是1234x400.jpg).
使用Picturefill,Firefox和Safari都可以在较小的屏幕上显示正确的图像.
在我今天的测试中,我推出了Opera,我暂时没有打开.它首次推出时是在v25,它会在较小的屏幕尺寸下显示正确的图像.
然后我注意到已经下载了更新,所以我运行它,更新到v27,然后Opera显示与最新Chrome相同的问题.
所以似乎Blink最近发生了一些变化.
任何人都可以证实这一点,或者我只是做错了吗?
Codepen来说明我的意思.
大多数专业网站都提到Opera用户代理都包含"Opera"这个词.
关键是:我的网站定期接收来自'OPR'浏览器的访问,而没有来自'Opera'.
今天早上的例子:
Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.73 Safari/537.36 OPR/34.0.2036.42
Run Code Online (Sandbox Code Playgroud)
将我的访问者的UA字符串传递给几个在线UA分析器,结果表明"OPR"是普通的Chrome.
任何人都可以确认真正的Opera浏览器是否在其用户代理中有"Opera"?
我想我发现了chrome和opera中的一个bug,想要一个解决方案,让css选择器section:last-of-type在文档仍在加载时工作.该错误仅在文档仍在加载时出现:这是NodeJS中用于公开错误的最小示例:
当文档仍在加载时,最后一个类型不匹配会发生什么.在IE中匹配,然后匹配两次,然后在加载时再次正确匹配.它在Firefox中运行良好.
最后的-type.js
"use strict";
const http = require(`http`);
const PORT = 8080;
const htmlStart = `<!DOCTYPE html>
<html lang="en"><head>
<meta charset="utf-8">
<title>html streaming</title>
<meta name="viewport" content="width=device-width">
<style>
section {
position: absolute;
left: 0;
right: 0;
}
section:last-of-type {
animation: comin 1.4s ease 0s;
left: 0;
opacity: 1;
}
@keyframes comin {
0% {
left: 100%;
}
100% {
left: 0;
}
}
section:not(:last-of-type) {
animation: comout 1.4s ease 0s;
left: -100%;
opacity: 0;
}
@keyframes comout { …Run Code Online (Sandbox Code Playgroud) 考虑一下:
<!DOCTYPE HTML>
<html><head><title>XML-problem</title>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('<p/>').load("text.xml", function(responseText, textStatus, xhr) {
var xml = $(xhr.responseXML);
var x_txt = xml.find('atom\\:x').text();
$(this).text(x_txt).appendTo('#container');
});
});
</script>
</head><body><div id="container" /></body></html>
Run Code Online (Sandbox Code Playgroud)
加载文档时,此脚本应加载text.xml.text.xml看起来像这样:
<xml xmlns:atom="http://www.w3.org/2005/Atom">
<atom:x>Text</atom:x>
</xml>
Run Code Online (Sandbox Code Playgroud)
加载此文件后,atom:x-node 的文本内容将附加到文档中.我可以在浏览器窗口中看到"文本".
这在Firefox中可以正常工作.但是,除非我将查询更改'atom\\:x'为just,否则它在Opera中不起作用'x'.在这种情况下,它适用于Opera,但不适用于Firefox.
我发现了一种解决方法,即将查询更改为'atom\\:x, x',但我更愿意深入了解这一点.
现在有趣的转折:我可以直接内联xml而不是通过更改从XHR获取它
var xml = $(xhr.responseXML);
Run Code Online (Sandbox Code Playgroud)
成
var xml = $('<xml xmlns:atom="http://www.w3.org/2005/Atom"><atom:x>Text</atom:x></xml>');
Run Code Online (Sandbox Code Playgroud)
在这种情况下,查询'atom\\:x'将在两个浏览器中提供所需的结果,并且在两个浏览器中都'x'不会产生任何结果.
事实上,这在Opera中的工作方式不同,这让我得出结论,前者的行为是Opera中的一个错误.这是一个合理的结论吗?我在哪里可以指出描述它应该如何工作的标准?
结论:
希望你能帮忙:)
我有一个使用Angular $ resource提供程序来处理对API后端的所有调用的Angular 1.5应用程序。我最近添加了一个具有拖放界面的功能,一旦将某项放入特定的存储桶中,我PUT就会向公共API方法执行对所有相关数据的请求以保存所述数据。
几个月前,我开发了它,甚至在一个特定版本中发现了Mac专用版本的Chrome中的一个奇怪错误(我们已经超过了2或3个版本),但是在其他情况下,它可以完美运行。
我最近在自己进行了一些测试之后才发布了它,但是我意识到Chrome和Opera浏览器都在PUT调用时出错,API从未收到请求。我唯一获得的信息是Chrome控制台中的以下说明:
PUT https://www.phpdraft.com/api/draft/59/pick/5026/depth_chart/37 net::ERR_SPDY_PROTOCOL_ERROR
要亲自查看,可以在以下网址进行该调用或类似的调用:PHPDraft
我怀疑我的服务器正在使用HTTPS可能是一个问题,但是ERR_SPDY_PROTOCOL_ERROR到目前为止,我到目前为止所做的Google搜索充其量是神秘的,听起来似乎不适合我的情况。
这是我$resource在Angular应用程序中用来进行此PUT调用(以及所有其他调用的方式)的方式:
angular.module('app').factory('api', function($resource, ENV) {
return {
DepthChartPosition: $resource(ENV.apiEndpoint + "commish/draft/:id/depthchartposition/:position_id", {
draft_id: '@draft_id',
position_id: '@position_id',
draft_sport: '@draft_sport',
manager_id: '@manager_id',
pick_id: '@pick_id'
}, {
'update': {
method: 'PUT',
url: ENV.apiEndpoint + "draft/:draft_id/pick/:pick_id/depth_chart/:position_id"
}
})
};
});
Run Code Online (Sandbox Code Playgroud)
上面的代码生成的请求本身如下所示:
General
Request URL: https://www.phpdraft.com/api/draft/59/pick/5026/depth_chart/37
Request Headers
Accept:application/json, text/plain, */\*
Content-Type: application/json;charset=UTF-8
Origin: https://www.phpdraft.com
Referer: https://www.phpdraft.com/draft/59/depth_chart
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) …Run Code Online (Sandbox Code Playgroud) 歌剧浏览器具有内置的VPN,可让您在浏览时隐藏IP。我的问题是在将OperaDriver与python中的硒一起使用时能否打开VPN?
尝试和问题的详细说明:
我有这个脚本,可以去网站显示我的IP地址。
from selenium import webdriver
from selenium.webdriver.opera.options import Options
from time import sleep
driver = webdriver.Opera(executable_path=r'/path/to/operadriver')
driver.get('https://whatismyipaddress.com')
sleep(10)
driver.quit()
Run Code Online (Sandbox Code Playgroud)
当我在启用了VPN的Opera浏览器上访问此站点时,我的IP被屏蔽,并显示一些其他IP地址。但是我的脚本打开了浏览器以显示我的真实IP地址。
我已经在SO以及其他站点上搜索了OperaDriver上的几乎所有问题。似乎绝对没有文档或任何与此相关的其他问题。
我最接近的是github上的此功能请求。OP表示,他可以通过使用OperaOptions加载自定义配置文件来使其工作。链接中发布的代码是
OperaOptions operaOptions = new OperaOptions();
operaOptions.addArguments("user-data-dir", "~/Library/Application Support/com.operasoftware.Opera");
driver = new OperaDriver(operaOptions);
Run Code Online (Sandbox Code Playgroud)
我试图在python中执行此操作,但没有任何结果。如果有任何问题,我可以使用Ubuntu 16.04,并且OperaDriver是从官方github页面下载的。Python版本为,3.6.7而Opera版本57.0.3098.116为Ubuntu 16.04 LTS (x86_64; Unity)。