Book Image

Joomla! 1.5 JavaScript jQuery

Book Image

Joomla! 1.5 JavaScript jQuery

Overview of this book

Ever wondered how all the great-looking, feature packed, amazing Joomla! sites are made? Would you like to add image transitions, popups, scrolls, AJAX forms, image galleries, no-page reloads to your website, but are worried that they will be difficult to implement? To make any Joomla! site look more professional, interactive, and interesting you need the ease and power of jQuery.This book will help you to use the jQuery library with the Joomla! CMS. It will take you through adding jQuery functionality to the Joomla! CMS and show how to use it to make the modules and themes more dynamic, interactive, and responsive, and add effects to your Joomla! site.The book starts by showing a plain Joomla! site without any JavaScript enhancement or features, then accompanies you through the process of site enhancement.First you will learn how to make use of third-party extensions to include jQuery features into your site. These can be image galleries, jQuery powered menus, tooltips, and many, many more. Later on you will learn how to modify your template to add some features to your Joomla! site, You will also learn to build your own jQuery-powered Joomla! extensions, and how to pack them so that you can use them in any project you like. Further, you will learn to create your own modules and components.By the end of this book, you will have learned how to enhance any Joomla! site with JavaScript and jQuery.
Table of Contents (16 chapters)
Joomla! 1.5 JavaScript jQuery
Credits
About the Author
About the Reviewers
Preface
Index

Using Firebug to help us in our development


Firebug, like the Web Developer toolbar, is another very useful extension, especially when developing JavaScript. But Firebug can be used for many other things, such as exploring the HTML or CSS of our site.

Like the previous extension, we can download this Firefox extension from the Firefox add-ons site at https://addons.mozilla.org.

Once installed, Firebug needs to be enabled from the add-ons screen:

Once enabled, a new button will appear at the bottom right-hand side of the Firefox browser. You will notice a tiny icon that looks like the previous icon, but smaller, as follows:

Once we click on this button, a new panel will appear with some tabs that we can see in the following screenshot:

How we can use two of these tabs, Console and HTML, is something that we are just about to find out.

Using Firebug to log messages

When working with JavaScript, especially AJAX, it's quite useful to know what is happening. For example, in our mod_littlecontact...