In this article I will show you how you can display your (or any other user’s) recent tweets with some jQuery magic. We will create a widget (sort of) that will fetch n number of latest tweets from public timeline of a user using Twitter API and then we will display them in a nice list.

End result will look like the following.

Have a look at a live example.

Let us start creating it now. First write some HTML. Define some css styles in the head section which will control the display of list. In the body section, there is a select box with id layout which will be used to select either a wide or a narrow layout for displaying the tweets. Then create a div with id tweets. We will create a ul inside this div which will have tweets as list items.

Click Here to Read full Article…

Here is one more sample chapter from my book. It explains reading, writing and editing XML files with PHP and jQuery. Below are the chapter contents.

• Loading XML from files and strings using SimpleXML
• Accessing elements and attributes using SimpleXML
• Searching elements using XPath
• Reading an XML using DOM extension
• Creating an XML using DOM extension
• Modifying an XML using DOM extension
• Parsing XML with jQuery

To read the full chapter follow this link - https://www.packtpub.com/article/working-with-xml-documents

You can also read the chapter on using JSON with PHP and jQuery.

innerHTML is commonly used property for setting html content of elements. Though it is not a standard property, even then all browsers support it. It is faster then using DOM methods like createElement and appendChild.

You can use it to set html for almost all elements. In internet explorer there are some exceptions. You cannot set innerHTML for elements of a table and select box.

Recently a reader asked me the workaround for setting options inside a select box with the help of javascript or jQuery. In this post I will explain some methods which you can use as an alternate to innerHTML.

Here is a html select box.

<select id="selectBox">
</select>

Now let us look at various options available to us.

Click Here to Read full Article…

I mentioned in a previous post that I was writing a book on PHP and jQuery. Well, after a labor of around 7 months the book is out now. It is available on Packt website as well as Amazon.

Meanwhile, to help you make a decision, a sample chapter from the book is available on Packt website. The chapter is Working with JSON in PHP and jQuery and it contains 4 articles that explain creating, reading and writing JSON in PHP as well as jQuery.

Below are the topics that this chapter covers:

• Creating JSON in PHP
• Reading JSON in PHP
• Catching JSON parsing errors
• Accessing data from a JSON in jQuery

To read the full chapter, just follow this link http://www.packtpub.com/article/working-json-php-jquery

Ajaxian

Ajaxian covers all news related to javascript, libraries, AJAX related news, technologies, libraries, browsers quirks etc.

Why?

Definitive resource for AJAX whether you use it with PHP, Perl, NET(argh!) or whatever else. This blog should not be missed.

A List Apart

This is a classic one. The creators of this web magazine call it “For people who make websites”.

A List Apart Magazine explores the design, development, and meaning of web content, with a special focus on web standards and best practices.

Why?

If you want to know all about building websites including design, code, writing compelling content and project management, this is the place.

Cats Who Code

Cats Who Code is a blog by Jean-Baptiste Jung who is a web developer and professional blogger.

Why?

For lots of helpful code snippets, lists and hacks on PHP, jQuery and definitive information on a variety of wordpress topics.

CSS-Tricks

CSS-Tricks is a website by renowned design ninja Chris Coyer where he shares his CSS secrets.

Why?

For detailed articles on how css works, browser hacks, cross browser compatibility and HTML 5.

Nettuts+

A part of Tuts+ Network, this site contains tutorials and screencasts on HTML, CSS, Javascript/jQuery, PHP, Ruby on Rails etc.Though most of the articles are free, it also publishes premium tutorials which are available for a small fee.

Why?
High quality articles that explain each topic step by step in detail and are very easy to follow even for a beginner.

Click Here to Read full Article…

jQuery is appropriately described as the “write less, do more” library. Few lines of code, if written appropriately, can produce wonderful tools or utilities.

In this article we will create a simple text rotator (or banner rotator whatever you want to call it). Simply put, there will be a placeholder which will have multiple quotations written inside it. These quotations will be displayed one by one with a fading effect. Have a look at the demo to see how it will look like.

Now that you have seen the demo and you find it interesting enough, here is how to create it.

Write the following html which will create a container div with id quotes. Inside this div, create multiple divs, each of which will hold a quotation and assign a css class textItem to them.

Except for 2 things, you can style the elements as per your wish. First, div with id quotes should have position as relative and each textItem should have position set to absolute. Absolute positioning for quotations will ensure that they are stacked on top of each other. This way if we fade out a quotation and fade in the next one, it will give desired effect.

Click Here to Read full Article…