Mozilla 도움말 검색

고객 지원 사기를 피하세요. 저희는 여러분께 절대로 전화를 걸거나 문자를 보내거나 개인 정보를 공유하도록 요청하지 않습니다. "악용 사례 신고"옵션을 사용하여 의심스러운 활동을 신고해 주세요.

자세히 살펴보기

show pixel dimensions of the current viewport in title / status bar

  • 9 답장
  • 1 이 문제를 만남
  • 2 보기
  • 최종 답변자: Siseby

more options

Can anyone recommend a Firefox addon that is compatible with FF quantum that shows the dimensions of the current viewport while resizing the browser window. Ideally in the status bar or title and updating "live" as you resize the window.

I had that with an old add-on that showed the dimensions in then right bottom corner of the window, very useful. Miss that terribly.

Thanks a lot!

Can anyone recommend a Firefox addon that is compatible with FF quantum that shows the dimensions of the current viewport while resizing the browser window. Ideally in the status bar or title and updating "live" as you resize the window. I had that with an old add-on that showed the dimensions in then right bottom corner of the window, very useful. Miss that terribly. Thanks a lot!

모든 댓글 (9)

more options

Do you need it only for web development? Try Responsive design mode in dev tools.

more options

Changing the contents of the <title> tag, or showing an overlay in the corner of the document, should be easy for an extension or user script.

Detecting resize events is not complicated, I have an example in this page:

https://www.jeffersonscher.com/res/resolution.php

But I haven't searched to see what might be available. Did you try the Add-ons site?

more options

Thank you, I tried the add-on site. With no luck. I just only like to have a short information of the display sizes when I resize the browser window, make it bigger and shorter- so I can check the design, but FLUIDLY, that I can see the size and the changing of the design in the breakpoints. I am NOT looking for a responsive layout checker.

Just a simple information of the domensions at the footer or somewhere else,..... I had that and got used to it. I like to have that back ;)

글쓴이 Siseby 수정일시

more options

Hi Siseby, what was the extension you used before called?

more options

Unfortunatly I cannot remember. But It was said, that it will not work in the update. It was shown in an add-on bar. https://addons.mozilla.org/de/firefox/addon/new-add-on-bar/

more options

Yes, it's not possible to generate an Add-on bar in Firefox 57, so the information would need to go somewhere else, like a floating div in the lower corner of the page.

To find the old name, you could check the Add-ons page. Either:

  • Ctrl+Shift+a (Mac: Command+Shift+a)
  • "3-bar" menu button (or Tools menu) > Add-ons
  • type or paste about:addons in the address bar and press Enter/Return

In the left column of the Add-ons page, click Extensions. Then on the right side, check near the top for a "Show Legacy Extensions" link.

more options

Thank you, it was the FIRESIZER ;) the dimension was shown in the add-on bar

more options

As a temporary workaround to display the viewport dimensions, do you want to try a bookmarklet? You can install it from here:

https://www.jeffersonscher.com/res/sumomarklets.html#ViewportDims

Firefox will not run bookmarklets on sites with certain CSP rules, but otherwise it should work.

This is the script run by the bookmarklet:

function updateResolution(){
  if(!document.getElementById('vw_pnl')){
    document.body.insertAdjacentHTML('beforeend','<div id="vw_pnl" style="position:fixed;right:1px;bottom:1px;z-index:9999;color:#000;background-color:#ffa;font-size:12px;margin:0;padding:2px"></div>');
  }
  vwpnl=document.getElementById('vw_pnl');
  vwpnl.innerHTML='<b>CSS:</b> '+window.innerWidth+' x '+window.innerHeight; 
  if(window.devicePixelRatio){
    var wdpr=window.devicePixelRatio; 
    vwpnl.innerHTML+=' <b>Device:</b>'+Math.round(window.innerWidth * wdpr)+' x '+Math.round(window.innerHeight * wdpr);
  }
  vwpnl.innerHTML+=' <button onclick="document.getElementById(\'vw_pnl\').style.display=\'none\';" style="font-size:12px;line-height:13px">x</button>';
}
var resizeTimeout; 
function resizeThrottler(){
  if(!resizeTimeout){
    resizeTimeout=setTimeout(function(){resizeTimeout=null;updateResolution();},200);
  }
}
window.addEventListener('resize', resizeThrottler, false); 
var vwpnl=document.getElementById('vw_pnl');
if(vwpnl){
  vwpnl.style.display='block';
}else{
  updateResolution();
}

글쓴이 jscher2000 - Support Volunteer 수정일시

more options

That is great! Thank you so much. It will help me a lot. Thank you again for your time and efforts! Probably there will be updates in the add-ons sooner or later. Until then: perfect!