Dezinerfolio

PHP + Javascript Image Replacement

Your rating: None Average: 4.4 (32 votes)

Some of you would have already used this but we thought to review this for those who haven't put their hands on it. This method is basically to get smooth font over your headings/titles. The package comes with a PHP and a Javascript file which replaces all the specified tags with images (dynamic). This can be applied to IDs/Classes/Tags on your site.

A few options over this:

  • Line Breaks (enable/disable)
  • Custom Fonts
  • Font Size / Color
  • Transparency
  • Image flickering (enable/disable)
  • more...

Customization

ifr.js

replaceSelector(" h2 "," ifr.php ",false); var testURL = " test.png " ;

  • h2 - Tag to be replaced with the image
  • ifr.php - the URL of the PHP file which generates the images.
  • false - Enable/Disable line breaks (splits each word into an image so it floats below and goes on)
  • test.png - the test image which loads to check if images are enabled on the browser (if not... the php will not generate the images)

.

ifr.php

$font_file = 'futura.ttf' ; $font_size = 30 ; $font_color = '#000000' ; $background_color = '#ffffff' ; $transparent_background = true ; $cache_images = true ; $cache_folder = 'cache' ; The above is very much self explanatory...

.

Here is a working demo for download: [download#26#image] All the files from the download has to be placed in the PHP server (localhost of your system). After you make the above changes you will look at index.php from your localhost for your new image replaced titles...

The final output:

This is a smooth font title generated over this method.

Another popular method would be sIFR where the titles are replaced with an SWF object.

<!-- WP Theme Credits -->

Find more about movie downloads.

Trackback URL for this post:

http://www.dezinerfolio.com/trackback/150

Comments

Anonymous's picture

For letters like y, the bottom of the image is cut out. Any way to fix this?

Michael Carronton (not verified)
Sun, 01/24/2010 - 05:44
Anonymous's picture

Facelift Image Replacement (or FLIR, pronounced fleer) is an image replacement script that dynamically generates image representations of text on your web page in fonts that otherwise might not be visible to your visitors. It is similar to sIFR which accomplishes this by using a combination of javascript, CSS, and Flash. FLIR generated image will be automatically inserted into your web page via Javascript and visible to all modern browsers. Any element with text can be replaced: from headers (

,

, etc.) to elements and everything in between.

ZK@Web Marketing Blog (not verified)
Mon, 06/08/2009 - 20:29
Anonymous's picture

man this website looks awesome... i mean the looks...
Content is cool too.

rolf (not verified)
Fri, 01/16/2009 - 16:04
Anonymous's picture

im bookmarkingyours :D

laina (not verified)
Mon, 01/12/2009 - 19:24
Anonymous's picture

This website is useful for individuals who are searching prayers and novenas and all.o

Vince (not verified)
Fri, 12/12/2008 - 12:10
Anonymous's picture

Nice site its very interesting site! your site is fantastic.

lhuv (not verified)
Fri, 12/12/2008 - 21:55
Anonymous's picture

You have an outstanding good and well structured site. I enjoyed browsing through it.i

jeroen (not verified)
Thu, 12/11/2008 - 00:49
Anonymous's picture

Fascinating site and well worth the visit. I will be backc

john (not verified)
Sat, 12/13/2008 - 03:30
Anonymous's picture

These prayers help me to keep God in my life, especially with the many distractions I encounter.h

Rosina (not verified)
Thu, 12/11/2008 - 21:57
Anonymous's picture

goodd

cozumilaclama (not verified)
Wed, 10/29/2008 - 23:35

Post new comment

The content of this field is kept private and will not be shown publicly.

Visualize