For those who like to use setTimeout() in javascript, you’ve probably notice you cant use that function in jQuery. By using the animate function you can delay all the jQuery you want.

$('#test').slideDown('normal').animate({opacity:"1.0"}, 3000).slideUp('normal');

Works in the order from left to right. slideDown() will happen immediately than a 3 second delay will occur right after. This delay is actually the amount of time the CSS is applied to the ID test. By putting opacity set to 100%, it literally doesn’t do anything but delay the next function. So slideUp() doesn’t start until animate() is done (which is 3000 milliseconds or 3 seconds).

$('#test').slideDown('normal').
slideUp('normal').slideDown('normal').
animate({opacity:"1.0"}, 3000).slideUp('normal');

Will go down, up, down, wait 3 seconds, then back up.
Try it out using<div id="test">Test</div>.

Image rollover is a very common design method on websites but many people use different methods in how they code their image rollover. The following method will show the best way to utilize the image rollover effect.

This will be a CSS class designated for a specified <a> tag.

.image1 {
 background-image: url("path/to/image/normal.gif");
 height: 100px;
 width: 100px;
 display: block;
}
.image1:hover {
 background-image: url("path/to/image/hover.gif");
 height: 100px;
 width: 100px;
 display: block;
}

After writing up the CSS, create the code in the HTML side

<a class="image1" href="#">Test</a>

The following will result in a 100 x 100 pixel rollover image link that can be used over and over, cross-browser.

Now the main issue with this is the loading aspect of the rollover image. When you declare it in the css, it not executed until the proper conditions are met (mouse hover). Meaning the hover.gif will not load until the user positions the mouse over the designated link. This will result in a quick blink in the image because its still loading when you put your mouse over it. To fix this you need to preload in javascript.

var test = new Image();
test.src = 'path/to/image/roll.gif';

Every rollover image is loaded along with the page and the “blink load” is no longer there. A clean transition from image to image on hover is established.

If your site is all custom coding, try making a PHP class that does all this for you. Create a public function that has the parameters of normal and rollover (and any other feature you want to add). Have it output the individual CSS class per image, a preload variable in the javascript, and the actual <a> tags within the html. A total of 3 output functions, 1 input functions, and unlimited processing functions in the class. This will save you a lot of time in coding and it will produce valid w3c coding. This will also eliminate the use of built-in methods that are in programs such as Adobe Dreamweaver and Microsoft FrontPage.

If your familiar with jQuery then you are very aware of what jQuery’s capabilities are and the limitless things you can do with them but can you utilize the functions properly? You can use jQuery for a quick movement of a widget or a fade in fade out for your tabs on the left or right hand side of your site but how about having a uniform way of using the functions. For example, every option on your widget should have a button that sends info through the AJAX function and returns information that second. This means your polls, image rotations (or ads), RSS feeds, and videos should have some function that sends info and returns information via jQuery->AJAX. If all your plug-ins on your site requires a new page when being interacted with, its time to use jQuery to optimize your user interface.

Initializing such a task is actually very difficult at start because there are a lot of items that need to be checked off. Call methods need to be kept clean in the source code and server-side scripts need to be organized in the root folders. Creating safe and secure scripts is also another priority. Try to keep everything uniform for your widgets (design and interface). Also the programming aspect of the widgets must have UI-friendly responses.

• @mediatemple can't access plesk right now or my a.c. 13 hours ago
• Sunday Morning to Tuesday Night 2010/09/05
• tried, sleep, work, work, work, sleep, work, tennis, work : 2010/09/05
• 4 consecutive days of declining hits :\ Also working too many projects this weekend, No worries though because its all due tuesday. 2010/09/05
• working for the next few days :\ 2010/09/04

• Optimizing WordPress Site Loading
• CodeIgniter – Multiple Views
• PHP CodeIgniter In a Nutshell
• PHP Redirect Index to Root
• Tutorial: How to Install WordPress
• 4 Ways to use an IP Address
• Download Twitter Followers
• Generation Twitter 2
• Parsing RSS Feeds using cURL and SimpleXML
• Next generation of communication, the reality of Twitter
• Starting a website Part 1
• What shall we $_GET today?
• PHP: Functions
• PHP: Redirect
• Geometry Wars Retro Evolved 2 API Simplified