Firefox에 여전히 3D DOM 뷰어가 있습니까? 같습니다. 이전 버전의 개발

한때 Firefox에 있던이 작은 기능을 만들 수없는 것 같습니다.

이전 버전의 개발 도구에 있던 3D 버튼이 사라져서이 기능의 흔적을 찾을 수없는 것 같습니다. 여전히 존재한다면 어떻게 활성화합니까?



답변

Firefox 47부터는 내장 3D보기를 더 이상 사용할 수 없습니다.

동일한 기능을 제공하는 애드온이 있습니다 : Tilt 3D .

참고 : 내장 버전과 마찬가지로 애드온은 다중 프로세스 Firefox에서 작동하지 않습니다.

Tilt 3D는 Firefox Quantum과 호환되지 않습니다.


답변

Firefox 버전 47까지 : 마우스 오른쪽 버튼을 클릭하고 “요소 검사”를 선택한 다음 도구 상자 메뉴의 왼쪽에있는 톱니 바퀴 아이콘을 클릭하면 “사용 가능한 도구 상자 단추”가 “3D보기”로 표시됩니다.

이 버튼을 클릭하면 도구 상자 메뉴에 새로운 아이콘이 추가되어 클릭하면 3D Dom보기가 표시됩니다.


답변

이동 : 환경 설정-> 일반 “다중 프로세스 Firefox 개발자 에디션 사용”을 선택 취소하십시오.

Firefox를 다시 시작하십시오

Goto : 개발자 도구 모음 [도구 상자 옵션], “3D보기”확인란이 “사용 가능한 도구 상자 단추”에 표시되어 있는지 확인하십시오.


답변

업데이트 : FF 47 이상에서 제거되었지만 추가 기능으로 제공됩니다 .

FF 업데이트로 인해이 기능이 비활성화 될 수 있습니다. FF 38이 설정 아이콘 위치를 변경했습니다.

Firefox 38-오른쪽 큐브와 톱니 바퀴 :


답변

이 질문은 FireFox와 관련이 있다는 것을 알고 있지만 Chrome 에서도이 기능을 사용할 수 있습니다 (Firefox에서는 JS를 책갈피로 삽입 할 수 없습니다).

이 자바 스크립트 코드를 북마크 URL로 추가하십시오.

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

추가 한 웹 사이트에서 책갈피를 클릭하십시오. Firefox에서와 같이 클릭하여 개요를 표시하고 드래그하여 볼 수 있습니다.


답변

Firefox 46.0은 여전히 여기에서 다운로드 할 수 있습니다 : https://ftp.mozilla.org/pub/firefox/releases/46.0/

그리고 여기에서 Tilt 3D 모듈 (Firefox 46.0에서) :
https://addons.mozilla.org/en-US/firefox/addon/tilt/

웹 개발자 도구의 기본 3D 뷰 보다 Tilt 3D로 렌더링 뷰가 더 좋아 보입니다 .

Tilt 3D와 3D View의 스크린 샷 비교


답변

Microsoft Edge 브라우저를 살펴보십시오.

나는 버전이 버전 79.0.283.0 (공식 빌드) 카나리아 (64 비트) . 검색 edge://flags/주소창에 개발자 도구 실험을 사용 합니다. 개발자 도구를 열고 Control + Shift + P를 누르고 실험을 검색 하고 DOM 3D보기 사용을 찾으십시오 .

이제 Ctrl + Shift + P > DOM 3D보기를 사용할 수 있습니다 .

Firefox 솔루션은 아니지만 저에게 효과적이었습니다.

나는 여기 에 대해 알아 냈습니다 .