PHP Classes
elePHPant
Icontem

picStylizer: Generate sprite images and CSS from image files

Recommend this page to a friend!
  Info   View files Example   View files View files (13)   DownloadInstall with Composer Download .zip   Reputation   Support forum   Blog (1)    
Last Updated Ratings Unique User Downloads Download Rankings
2016-01-08 (3 years ago) RSS 2.0 feedNot enough user ratingsTotal: 237 All time: 7,864 This week: 335Up
Version License PHP version Categories
picstylizer 1.2GNU General Publi...5HTML, Graphics, Utilities and Tools, F..., P...
Description Author

This class can generate sprite images and CSS from image files.

It can traverse given directories and extract the list of images.

The class can create a new sprite image with all the found images and a CSS file to show those images as background pictures of Web page elements.

  Performance   Level  
Name: Luciano Salvino <contact>
Classes: 11 packages by
Country: Argentina Argentina
Age: 46
All time rank: 147818 in Argentina Argentina
Week rank: 75 Up1 in Argentina Argentina Up
Innovation award
Innovation award
Nominee: 9x

 

Details

picStylizer

picStylizer is a PHP class that create sprite and css style file from images folder

Notice: if you want to change the image onMouseOver (hover) you have add "_hover" at the end of filename before the extention Example: // initial image icon.png // hover image icon_hover.png //adding _hover // the result css code will be: .icon {...} .icon:hover {...}

Usage

// Initialize Class
$pS = new picStylizer();

// define folder configuration
$config = array(
			// set the origin folder
			"origin" => array(
				"images" => "origin/images" // folder from where the script will take the images
			),
			// set destiny folder
			"destiny" => array(
				"styles" => "destiny/css/sprites.css", // define css style of sprites
				"sprites" => "destiny/sprites/sprites.png", // define the sprite image result
				"example" => "destiny/example/sprites.html", // define the html example
				"ini_path" => "../../" // define the path
			)
		);
$pS->setFoldersConfig($config);

// define minization (default: true)
$pS->setMinization();

// define css style by default
$css = 'body {backgound-color:#000;font-family:courier;color:#fff,font-size:14px;}';
$pS->setCssInit($css);

// gen sprites, styles and html example
$pS->getSprite();
  Files folder image Files  
File Role Description
Files folder imagedestiny (3 directories)
Files folder imageorigin (1 directory)
Accessible without login Plain text file composer.json Data composer
Accessible without login Plain text file example.php Example example
Accessible without login Plain text file LICENSE Lic. license
Plain text file picStylizer.php Class class
Accessible without login Plain text file README.md Data readme

  Files folder image Files  /  destiny  
File Role Description
Files folder imagecss (1 file)
Files folder imageexample (1 file)
Files folder imagesprites (1 file)

  Files folder image Files  /  destiny  /  css  
File Role Description
  Accessible without login Plain text file sprites.css Output css file result

  Files folder image Files  /  destiny  /  example  
File Role Description
  Accessible without login HTML file sprites.html Output html file result

  Files folder image Files  /  destiny  /  sprites  
File Role Description
  Accessible without login Image file sprites.png Output image sprites result

  Files folder image Files  /  origin  
File Role Description
Files folder imageimages (1 file, 1 directory)

  Files folder image Files  /  origin  /  images  
File Role Description
Files folder imageicons (4 files)
  Accessible without login Image file progress_bar.png Icon image example

  Files folder image Files  /  origin  /  images  /  icons  
File Role Description
  Accessible without login Image file icon_f.png Icon image example
  Accessible without login Image file icon_g.png Icon image example
  Accessible without login Image file icon_tw.png Icon image example
  Accessible without login Image file icon_tw_hover.png Icon image example

 Version Control Unique User Downloads Download Rankings  
 100%
Total:237
This week:0
All time:7,864
This week:335Up