Deprecated: Creation of dynamic property WPtouchProFour::$settings_object is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/wptouch/core/class-wptouch-pro.php on line 82

Deprecated: Automatic conversion of false to array is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/wptouch/core/admin-load.php on line 70

Deprecated: Creation of dynamic property Advanced_Editor_Tools::$toolbar_classic_block is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/tinymce-advanced/tinymce-advanced.php on line 347

Deprecated: Creation of dynamic property Advanced_Editor_Tools::$toolbar_block is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/tinymce-advanced/tinymce-advanced.php on line 349

Deprecated: Creation of dynamic property Advanced_Editor_Tools::$toolbar_block_side is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/tinymce-advanced/tinymce-advanced.php on line 350

Deprecated: Creation of dynamic property Advanced_Editor_Tools::$panels_block is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/tinymce-advanced/tinymce-advanced.php on line 351

Deprecated: Creation of dynamic property Advanced_Editor_Tools::$used_block_buttons is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/tinymce-advanced/tinymce-advanced.php on line 354

Deprecated: Creation of dynamic property YARPP::$is_custom_template is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/yet-another-related-posts-plugin/classes/YARPP_Core.php on line 56

Deprecated: Creation of dynamic property YARPP::$db_options is deprecated in /home2/learnera/public_html/tech/wp-content/plugins/yet-another-related-posts-plugin/classes/YARPP_Core.php on line 69

Warning: Cannot modify header information - headers already sent by (output started at /home2/learnera/public_html/tech/wp-content/plugins/wptouch/core/class-wptouch-pro.php:82) in /home2/learnera/public_html/tech/wp-includes/feed-rss2.php on line 8
Firebug – Rajesh http://tech.learnerandtutor.com A Developer Fri, 09 May 2014 06:11:15 +0000 en-US hourly 1 https://wordpress.org/?v=6.5.2 Firebug Tutorial Part 1 – Introduction http://tech.learnerandtutor.com/firebug-tutorial-part-1-introduction/ http://tech.learnerandtutor.com/firebug-tutorial-part-1-introduction/#respond Fri, 09 May 2014 05:48:45 +0000 http://tech.learnerandtutor.com/?p=77 Continue reading ]]> Firebug is a free open source tool that allows debugging, editing and monitoring any website’s CSS, HTML, DOM and JavaScript. It can also be used for Performance analysis.

How to install firebug?

Installing on Firefox browser

Firebug is developed as a Firefox add-on. It can be added to Firefox browser as like other add-ons. The add-on can be downloaded from Firefox add-on page https://addons.mozilla.org/en-US/firefox/

Installing on Non-Firefox browsers

For non-Firefox browsers there is a lite version available to use. It can be downloaded from here.https://getfirebug.com/firebuglite

It can be imported like a normal script in any html page. See code below.

<script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'>
</script>

Once the firebug installed while pressing the F12 button you will get a window like this.


download

Firebug Modes
Dock View

Firebug Window attached as a panel to browser (useful for HTML,CSS tweaks)

Window mode

Separate window for firebug (useful for Net tab, performance related tuning)
download (1)
To change the view either click the toggle button in the right corner or click Ctrl+F12 to do by shortcut.

]]>
http://tech.learnerandtutor.com/firebug-tutorial-part-1-introduction/feed/ 0