Dynamic diagonal text overlay with solid background color

GD and GD2 are useful libraries for creating graphics on-the-fly. Discuss your PHP GD and GD2 scripts here.

Moderators: onion2k, General Moderators

Post Reply
User avatar
Benjamin
Site Administrator
Posts: 6935
Joined: Sun May 19, 2002 10:24 pm

Dynamic diagonal text overlay with solid background color

Post by Benjamin »

I'm looking for some advice on how to create an image like the example below. Basically the algorithm will take an image and overlay it with dynamic text in the top right corner.

I'm assuming the best way to do this is to overlay two transparent png images over the top of the background image. What's the quickest way to accomplish this and what are the recommended functions to use?
Attachments
finished.jpg
finished.jpg (9.74 KiB) Viewed 5444 times
User avatar
akuji36
Forum Contributor
Posts: 190
Joined: Tue Oct 14, 2008 9:53 am
Location: Hartford, Connecticut

Re: Dynamic diagonal text overlay with solid background color

Post by akuji36 »

I believe you could use css and html:

create a div with red background color
and angle text which can be styled
using css

create a class and use it for all images.
User avatar
jayshields
DevNet Resident
Posts: 1912
Joined: Mon Aug 22, 2005 12:11 pm
Location: Leeds/Manchester, England

Re: Dynamic diagonal text overlay with solid background color

Post by jayshields »

akuji36 wrote:I believe you could use css and html:

create a div with red background color
and angle text which can be styled
using css

create a class and use it for all images.
Have you got an example of that? I believe there are no ways to angle things in the current, widely-supported version of CSS.
Post Reply