Sunday, August 16, 2009

DevTnT 11 - Browser Plug-in: Firebug et al.

Firebug is a plug-in for Firefox that enables you to inspect the DOM of the web page that you are currently viewing. It also enables you to inspect the CSS styles of any given element, and trace those styles back to their definitions in CSS files. There is also a script debugger and a console.

FireBug

Firebug also comes as a light version for Internet Explorer, Opera and Safari: http://getfirebug.com/lite.html. It is a JavaScript file that you can either include in your html file (if you are developing the html file) or as a bookmarklet if you don’t own the html file.

Other browsers have their own Firebug-like plug-ins of course: Internet Explorer Developer Toolbar for IE, Dragon-Fly for Opera (Menu Tools –> Advanced –> Developer Tools), Chrome (Page button –> Developer –> JavaScript Console) and Safari (Page button –> Develop –> Show Web Inspector).

Note: if there is no “Develop” menu in Safari, you can enable it using Setting button –> Preferences –> Advanced –> Show Develop menu in menu bar.

No comments:

Post a Comment