Jump to content
xisto Community
Sign in to follow this  

Including An Imgs Clock For Your Web PHP Tutorial

Recommended Posts

When you load a page, is nice to see what day it is, and the time of the moment of loading the page, but isn't nicer to see the time with custom imgs?, i.e. you could put a binary clock at the top of your web, ect.

So, there's another php microtutorial that i hope it's going2help someone.

First of All, you have to set in your mind clearly what kind of clock want to put in your web (always with numbers, digital), and then, you have to do in Photoshop or your chosen image editor, the images for the numbers. In example, if you want a classic digital clock that prints '12:34 am', you'll need to do images from the 0 to the 9, and the am/pm indicator. If you want a Internet Swatch Time clock that prints '@345' you'll need to do the numbers and the @ only, ect.

For binary clocks, i recommend you to do from the 0 to the 111011 (with black/white dots representing 0/1), so you'll need to do 59 imgs. I recommend that cuz it's easier to embed on you want. If you only wanna do 2 images (black and white dot), we'll need to do some phpmaths that i'll explain further.

We'll start for a simple clock, we assume that you have a root folder '/' and an images folder '/img/', so you have to create a page, in example we're going to name it clock.php (in the example, a 24h clock).

<?$time1=date('H'); // Hours$time2=date('i'); // Minutessettype($time1,integer);settype($time2,integer);$h1=((int)($time1/10));$h2=($time1-($h1*10));$m1=((int)($time2/10));$m2=($time2-($m1*10));echo '<img src="img/"'.$h1.'.jpg">';echo '<img src="img/"'.$h2.'.jpg"> '; // Note that I have left a lil space separating the Hours from the Minutes.echo '<img src="img/"'.$m1.'.jpg">';echo '<img src="img/"'.$m2.'.jpg">';?>
Remember you MUST place imgs from 0.jpg to 9.jpg. It could look nicer if your images are png with transparencies (only our loved firefox will be able to view it, but i think all we use it :)), if you want to, only will have to change the .jpg extension by the .png (or whatever you want) on the php code.

Another day I might do the binary clock, so tired 2day :(, but i may edit that same post, so remember visiting it again lol.

Cya all!

Share this post

Link to post
Share on other sites

Thanks for the tutorial. I really suck at PHP (Prehypertext Processor). I will consider keeping a log of PHP tutorials, they might be really helpful someday.Your tutorial can add benefit to all websites.

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.