How to hide/minimum Firefox Developer Tool without close it? - firefox-developer-tools

Because Open/Close it loss all requests in tab Network, so how to hide/minimum Firefox Developer Tool without close it?
Similar to Firebug.
Thank you

There is currently (as of Firefox 52.0.2) no option to minimize the DevTools. Until Firefox 40 there was one, though it got removed in Firefox 41 with the following reasoning:
It didn't get any UX review and not everyone was in agreement about the UI for it.
It is planned to get added back again, though.

You can do this by popping the DevTools out into its own window (the icon just to the left of the close button). DevTools is then a separate window which can be minimized/maximized, etc.
The button to move DevTools into a separate window:
The standard minimize button:

Related

How to check google font load time

I want to use a google font(Roboto/Open Sans).
Where I can check which font taking much time to load?
As I remember google.com/fonts had this feature earlier: http://prntscr.com/ekyy1d but now I can't find it there...
you can use your browser's dev tools to get the file size and how long it took to download from the CDN.
This is chrome, under the "network" tab in dev tools http://i.imgur.com/aJEaCBC.png
Wasn't able to find the gauges but there is an indication of the speed in the lower right menu bar.
screenshot of menu bar

Chrome Animations button missing

I'm trying to find a way to debug my CSS animations in Chrome specifically. I downloaded the latest version of Chrome Canary since it was supposed to contain this feature. Multiple sources confirm that there should be a button in the DevTools under the style tab.
However, the button is simply not there. It's also not available in the most recent version of regular Chrome, or in the Chrome a colleague of mine uses. Is there some setting I'm missing?
It's very hard to find a good source for this problem, that's why I'm asking you guys for help :)
I'm not sure why there's no button, but you can open the animation tool by selecting it from the context menu in the console drawer.
My chrome version is 61 and the animation button is now moved to "More tools" under the 3 dots to the top right. Hope my answer can help those who view this post recently.

Firefox inspector - CSS rules suggestions/hints

I have a problem with the inspector in Firefox browser. After some time of use, in the "rules" tab, system don't want to show me CSS syntax suggestions. After switching the inspector off and on, everything returns back to normal, but ... again ... after a few moments, the system stops showing me syntax hints.
with syntax hints without syntax hints
after a couple of minutes
Is there any FIX for this? I'm using newest "FireFox Developer Edition" (same thing on normal "Firefox").
UPDATE:
I discovered that inspector starts to work improperly when I restart a page which I have been "inspecting".
Are you using Firefox Developer Edition 41.0a2? It appears to have possibly been a bug that is being corrected.
I can confirm this happens in Firefox 40.0.2.
I also saw this in Firefox Developer Edition 41.0a2.
I updated Firefox Developer Edition to 42.0a2 and am no longer able to recreate this phenomenon.
Install firebug plugin for firefox. Ita a very good debugger tool. After installing enable it and right click on page and do "inspect element with firebug"

close current web form in asp.net

How i can close current web form in web based application?
I have tried with following code:
mybutton.Attributes.Add("onclick","window.close()")
But its not working
Help me. Thank you.
You can use window.close() to close a pop-up window only. If you really need to close the window, use a pop-up instead. However review why the closing is important? You may consider a redirection (either server.transfer or response.redirect).
Update:
Looking at the discussion at this stage, we need to see the relevance of why wee need to close the window as desired. What is the business value that we are achieving?
You can use the following script to close the current window in Chrome and IE (I checked in IE8).
mybutton.Attributes.Add("onclick", "window.open('', '_self');window.close();");
but it still won't work in Firefox. See more info on this: How can I close a window with Javascript on Mozilla Firefox 3?
But because it is a workaround (as Kangkan said window.close() should be used only to close popup window created by window.open() ), it is not a reliable solution and can be broken if a new browser version is out.
Bottom line: there is no reliable, universal solution for your problem, there is no proper way to close a non-popup window from javascript. If you can rely on the fact that your site will be used only in IE, Chrome, etc. you can use a workaround/hack (see above - but don't forget, it can easily be broken in next browser release), otherwise you should consider a different approach of the problem, instead of closing the window.

Full on-the-fly stylesheet editing in Chrome or Safari

I hate Firefox, I really do, but as a web developer I'm chained to it b/c of the robust set of tools that Firebug offers. Recently Chrome and Safari's inspection tools allowed users to edit full chunks structural code (in a very buggy manner), but you still can't edit full stylesheets. Usually when someone brings this up, Chrome and Safari developers say "BUT YOU CAN EDIT CSS," and that's true, to an extent. You can edit CSS property-by-property (which takes forever if you have a lot of changes) in both browsers, but there is no way to see the full computed stylesheet, make edits within it, and immediately see the results. To date, only a full install of Firebug on Firefox allows you to do this.
Has there been any momentum in either of the Chrome or Safari camps to build a plugin to match this unparalleled function? Cheap plugins that allow you to insert CSS into the page are not the answer. It's really simple:
Have a list with the current stylesheets that are being referenced
Choose the one you want to edit, and click an edit button
See all the code in the stylesheet
Make changes and see them reflected on the page immediately
Is it really that hard to build something that does this? I think it must be, b/c why else would the developer communities of two browsers completely ignore it? If there's something out there that now offers this capability, I'd love to hear it; otherwise, maybe someone will step up to the plate and develop it for either Chrome or Safari. It seems like the guys who developed the CSS Edit app would be all over this.
Thanks to you I found it!
The Live Stylesheets extension for Chrome is what you are looking for. Be sure to restart Chrome after installation to use it.
You can edit external stylesheets in Chrome DevTools, too (since Chrome 15 or so). Just double-click the stylesheet contents in the Resources panel (or click the "Edit" button below), edit, Ctrl-S to commit a new revision, Esc to cancel editing. And it updates your page as you type!
You can edit your CSS files directly on Chrome without relying on any extension.
Here is how: Edit CSS files on the fly using Chrome DevTools
A different way to access it:
right click the page, select inspect
on the DevTools, click on "Sources"
locate the css on the "Network" pane and click it
change the css and save it ( by pressing ctrl+s )

Resources