Feb
6
Alternate Background Colors Using PHP
Posted by john in javascript, php, programing

background_change.gifYou now can look in almost any website or web application where the background colors are alternating. This is a great (and easy) way to improve the user interface for the end users.

Here’s a quick explanation of what’s going on in the demo file below:

First we set the alternating backgrounds we want to use.

$bg1 = "#f5f5f5";
$bg2 = "#FFFFFF";

Then as we pass through a loop of some kind this code snip rotates the variable $bg to the background colors we set above:
$bg = ($i++ & 1) ? $bg1 : $bg2;

In the example files, we’ve added some javascript to the table
’s to add an additional hover effect as well as some styling to improve the look of the tables.

Demo | Source File

Comment if you have any questions or suggestions.



Jan
10
Fade In and Out Images from a Single Directory Using jQuery (with plugin)
Posted by john in javascript, php

A friend of mine recently requested a quick image rotator script that was not using Flash, but would use Javascript. Below is a script that will read through a single directory and look for any image file (jpg, gif, or png) and rotate it.

Requirements:

  1. PHP
  2. jQuery (latest version)
  3. InnerFade plugin (see docs for variables explanations and additional vars)
// Global Variables
$image_dir = "$_SERVER[DOCUMENT_ROOT]/examples/imgs"; // directory on server
$image_relative_path = '/examples/imgs'; // path to images relative to script
$file_types = array('jpg','jpeg','gif','png');
$image_time = '4000'; // seconds each image will display (4000 = 4 seconds)

if($handle = opendir($image_dir)) {
	while (false !== ($file = readdir($handle))) {
	if ($file != "." && $file != "..") {
		$ext_bits = explode(".",$file); // finds file extensions
		foreach($ext_bits as $key => $value){
			if(in_array($value,$file_types)){
				$image_rotation .= '
  • '; } } } } closedir($handle); }
    
    
    
    
    
    
      < ?= $image_rotation; ?>

    Live demo or source file rotating three images for single directory

    If you have any questions about this, please leave a comment.

    John



    Oct
    12
    70+ JavaScript Resources for Every Web Developer
    Posted by john in javascript

    More javaScript resources than you could ever ask for. Jason does another great job getting them all together in one convenient place.

    read more | digg story



    |