O Firefox ainda tem o visualizador 3D DOM?

77

Não consigo entender esse pequeno recurso que já existia no Firefox.

O botão 3D que estava lá em uma versão anterior das ferramentas de desenvolvimento desapareceu e não consigo encontrar nenhum vestígio desse recurso em nenhum lugar. Se ainda estiver lá, como ativá-lo?

MildlyIn Interessante
fonte
7
Você pode reconsiderar para alterar sua resposta aceita? Firefox 47 mudou este e que a funcionalidade 3D completamente removido agora
rubo77

Respostas:

29

A partir do Firefox 47, a visualização 3D integrada não está mais disponível.

Há um complemento que oferece a mesma funcionalidade: Tilt 3D .

Nota: assim como a versão interna, o complemento não funciona no multiprocesso Firefox.

O Tilt 3D NÃO é compatível com o Firefox Quantum.

t9toqwerty
fonte
Tem certeza de que ele não funciona nos e10s pultiprocessos? veja how-to-check-se-multiprocess-e10s-option-se habilitados para-in-your-firefox
rubo77
@ rubo77 Sim, verifiquei no Firefox Developer Edition. O Tild 3D não funciona no Multiprocess e10s.
T9toqwerty
Parece que o multiprocesso deve ser desativado no meu firefox 47, pois o Tild 3D funciona. (Eu não desativá-lo manualmente)
rubo77
parece que o Tilt 3D não suporta a versão Firefox Quantum - alguma sugestão para alternativa?
serup
2
@serup, você está certo, mas eu não consegui encontrar outra alternativa. Deixe-nos saber se você encontrar algum.
precisa saber é o seguinte
70

Até a versão 47 do Firefox: se você clicar com o botão direito do mouse e selecionar "Inspecionar elemento" e, em seguida, clicar no ícone de roda dentada no lado esquerdo do menu da caixa de ferramentas, deverá ver "Botões disponíveis da caixa de ferramentas" sob a qual aparece "Visualização 3D".

insira a descrição da imagem aqui

Clicar nesse botão adicionará um novo ícone ao menu da caixa de ferramentas que, quando clicado, exibirá a visualização 3D Dom.

insira a descrição da imagem aqui

Jason Aller
fonte
3
Por padrão, não estava ativado na versão que eu usei ao responder à pergunta.
Jason Aller
24
Parece que foi completamente removido da edição de desenvolvedor do firefox. Que pena, pois realmente o diferencia do Chrome.
Raio Suelzer
2
Por que eles enterraram assim? Frustrante experiência do usuário.
Inorgik
12
"A partir do Firefox 47 em diante, a visualização 3D não está mais disponível. Há um complemento que oferece a mesma funcionalidade: Tilt 3D. No entanto, observe que, assim como a versão interna, o complemento não funciona no multiprocesso do Firefox . " Fonte: developer.mozilla.org/pt-BR/docs/Tools/3D_View
nachtigall
4
Você está certo, esta resposta está desatualizada, já que FF 47, a resposta de @ThorOdinson abaixo deve ser aceita. Tilt 3D funciona muito bem
rubo77
8

Ir para: Preferências-> Geral Desmarque "Ativar o multiprocesso Firefox Developer Edition"

Reinicie o Firefox

Vá para: Barra de ferramentas do desenvolvedor [Opções da caixa de ferramentas], caixa de seleção "Visualização 3D" agora deve aparecer em "Botões disponíveis da caixa de ferramentas", verifique se está marcada e se você está bem.

drewfg
fonte
Não consigo encontrar essa opção no meu alemão Firefox 47.0, talvez ele é chamado de algo como electrolysisou e10sem about:config. Enfim: Eu acho que não é uma boa idéia para desativar o novo recurso de multiprocessador apoio
rubo77
4

Atualização : Foi removido do FF 47 em diante, mas está disponível em um complemento .

Parece que as atualizações do FF podem desativar isso. O FF 38 mudou a localização do ícone de configurações.

Firefox 38 - cubo e roda dentada à direita:

Firefox 38

Nick Westgate
fonte
3

Eu sei que esta pergunta é em relação ao FireFox, mas você também pode obter esse recurso no Chrome (o Firefox não permitirá que você insira JS como marcador):

3D View Chrome

Adicione este código javascript como um URL de marcador:

javascript:void function(b,p)%7Bfunction l(k,c,b,e,g,d,f)%7Breturn"<div style%3D%27position:absolute%3B-webkit-transform-origin: 0 0 0%3B"%2B("background:"%2Bf%2B"%3B")%2B("width:"%2Be%2B"px%3B height:"%2Bg%2B"px%3B")%2B("-webkit-transform:"%2B("translate3d("%2Bk%2B"px,"%2Bc%2B"px,"%2Bb%2B"px)")%2B("rotateX(270deg) rotateY("%2Bd%2B"deg)")%2B"%3B")%2B"%27></div>"%7Dfunction o(k,c,d,f)%7Bfor(var j%3Dk.childNodes,n%3Dj.length,m%3D0%3Bm<n%3Bm%2B%2B)%7Bvar a%3Dj%5Bm%5D%3Bif(1%3D%3D%3Da.nodeType)%7Ba.style.overflow%3D"visible"%3Ba.style.WebkitTransformStyle%3D"preserve-3d"%3Ba.style.WebkitTransform%3D"translateZ("%2B(b%2B(n-m)*q).toFixed(3)%2B"px)"%3Bvar h%3Dd,i%3Df%3Ba.offsetParent%3D%3D%3Dk%26%26(h%2B%3Dk.offsetLeft,i%2B%3Dk.offsetTop)%3Bo(a,c%2B1,h,i)%3Be%2B%3Dl(h%2Ba.offsetLeft,i%2Ba.offsetTop,(c%2B1)*b,a.offsetWidth,b,0,g%5Bc%25(g.length-1)%5D)%3Be%2B%3Dl(h%2Ba.offsetLeft%2Ba.offsetWidth,i%2Ba.offsetTop,(c%2B1)*b,a.offsetHeight,b,270,g%5Bc%25(g.length-1)%5D)%3Be%2B%3Dl(h%2Ba.offsetLeft,i%2Ba.offsetTop%2Ba.offsetHeight,(c%2B1)*b,a.offsetWidth,b,0,g%5Bc%25(g.length-1)%5D)%3Be%2B%3Dl(h%2Ba.offsetLeft,i%2Ba.offsetTop,(c%2B1)*b,a.offsetHeight,b,270,g%5Bc%25(g.length-1)%5D)%7D%7D%7Dvar g%3D"%23C33,%23ea4c88,%23663399,%230066cc,%23669900,%23ffcc33,%23ff9900,%23996633".split(","),q%3D0.001,e%3D"",d%3Ddocument.body%3Bd.style.overflow%3D"visible"%3Bd.style.WebkitTransformStyle%3D"preserve-3d"%3Bd.style.WebkitPerspective%3Dp%3Bvar r%3D(window.innerWidth/2).toFixed(2),s%3D(window.innerHeight/2).toFixed(2)%3Bd.style.WebkitPerspectiveOrigin%3Dd.style.WebkitTransformOrigin%3Dr%2B"px "%2Bs%2B"px"%3Bo(d,0,0,0)%3Bvar f%3Ddocument.createElement("DIV")%3Bf.style.display%3D"none"%3Bf.style.position%3D"absolute"%3Bf.style.top%3D0%3Bf.innerHTML%3De%3Bd.appendChild(f)%3Bvar j%3D"NO_FACES"%3Bdocument.addEventListener("mousemove",function(b)%7Bif("DISABLED"!%3D%3Dj)%7Bvar c%3Db.screenX/screen.width,b%3D(360*(1-b.screenY/screen.height)-180).toFixed(2),c%3D(360*c-180).toFixed(2)%3Bd.style.WebkitTransform%3D"rotateX("%2Bb%2B"deg) rotateY("%2Bc%2B"deg)"%7D%7D,!0)%3Bdocument.addEventListener("mouseup",function()%7Bswitch(j)%7Bcase "NO_FACES":j%3D"FACES"%3Bf.style.display%3D""%3Bbreak%3Bcase "FACES":j%3D"NO_FACES",f.style.display%3D"none"%7D%7D,!0)%7D(25,5E3)%3B

Instruções para visualização em 3D

Depois de adicionado, clique no marcador em qualquer site. Você pode clicar para mostrar contornos e arrastar para visualizar como no Firefox.

user45288
fonte
2

O Firefox 46.0 ainda pode ser baixado aqui: https://ftp.mozilla.org/pub/firefox/releases/46.0/

E incline o módulo 3D aqui (do Firefox 46.0): https://addons.mozilla.org/en-US/firefox/addon/tilt/

A exibição de renderização parece melhor com o Tilt 3D do que com a exibição 3D nativa das Ferramentas para Desenvolvedor da Web:

Comparação de capturas de tela entre o Tilt 3D e o 3D View

Klemart3D
fonte
thx pelos links, me salvou um pouco da vida.
Mondjunge
2

Dê uma olhada no Microsofts Edge Browser.

Tenho a versão 79.0.283.0 ( versão oficial) canary (64 bits) . Coloque edge://flags/na barra de endereço e ative as experiências das Ferramentas do desenvolvedor . Abra as ferramentas do desenvolvedor, pressione Control + Shift + P, procure Experiments e localize Enable DOM 3D view .

Agora você pode usar Ctrl + Shift + P > DOM 3D View .

Não é uma solução do Firefox, mas funcionou para mim.

Eu descobri isso aqui .

ǝlpoodooɟƃuooʞ
fonte
-1

Foi lançada após a versão 46. Uma solução para isso é o Google "Firefox 46 download" Instale essa versão e renomeie-a (no Mac) para algo como o firefox-45 para manter a versão atualizada também. Inicie a versão 45 e desative as atualizações automáticas. Agora você pode ativar a visualização 3D, ver a página em 3D e incliná-la.

Espero que funcione para você.

Adam Ema
fonte