Web Design Firebug for IE,Safari,Chrome & Opera | Firebug for IE,Safari,Chrome & Opera |
|
|
|
| Written by Administrator | |||||||
| Monday, 19 October 2009 | |||||||
|
Tag it:          Firebug is certainly one of the main assets for web development available. I use it daily in the web development and I know that is the plugin of choice for many others. An undesirable side effect of Excellent Firebug is that other similar tools for other browsers pale in comparison and seem inferior. Troubleshooting design problems and issues of CSS in IE, for example, can be a lesson in futility. <script type="text/javascript" src="http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js"></script> To use Firebug Lite Offline: Download source here Import firebug-lite-compressed.js or firebug-lite.js into your site's directory. Find "firebug-lite.css" URL on the javascript file which you imported and replace this with offline address of firebug-lite.css file. That’s it, when you run the page in any other browser, Firebug Lite will be present on the page. For off line use, the script file, as well as a CSS file, can be downloaded and should just be used like any other JS or CSS file. The following screenshot shows Firebug Lite in IE:  Firebug Lite provides you with the same inspections capability that regular Firebug does. You can click the Inspect button and hover over sections of the page to view the computed style and DOM properties for the tag selected. The Inspect button functionality does seem to have some issues, so another way to inspect elements is to navigate the HTML tree. To do that, click the + signs on the tree view to expand the HTML, and when you see the element you want to inspect, click on the line of code for it in the HTML. On the right side, you can view the computed style and the DOM (Document Object Model) properties for the element. Firebug Lite also has the JavaScript console, which allows you to execute JavaScript. You can write one line at a time, or in the expanded view you can write many lines at once and then run the code. Although you cannot edit the CSS for the highlighted element, Firebug Lite does provide a mechanism for editing CSS. It is somewhat of a “CSS console” for lack of a better term, where you can write your own CSS code and see what the results will look like.  Of course, with a name like Firebug Lite you can’t expect it to have all of the features of Firebug. Unfortunately, it does not include any JavaScript debugging (I can’t even imagine how difficult it would be to write a JavaScript debugger in Javascript). Unfortunately, you’re still stuck with whatever JavaScript debugging tools you can find for your browser. It does at least provide you with the convenience of being able to easily view the code for script files that were loaded in the page. Firebug Lite also lacks the layout features in regular Firebug, where it shows you the coordinates for the element being inspected, as well as the padding, border size, and margins. All in all it is better to have Firebug Lite for other browsers than no Firebug at all. If you are trying to debug layout and viewing issues in other browsers, it is definitely a nice tool to try out. Tag it:
Powered by !JoomlaComment 3.26
3.26 Copyright (C) 2008 Compojoom.com / Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved." |
|||||||
| Last Updated ( Friday, 13 November 2009 ) | |||||||
Search
Categories
| Visual Studio (1) |
| Troubleshoot (1) |
| Web Design (1) |
| Operating Systems (1) |
| SharePoint (1) |
| Sql Server (1) |
| DotNet (1) |
2009-10-26 22:47:52