View Full Version : product preview text layer for jersey printing

09-03-2011, 07:27 AM
one of my competitors uses a preview page with a table with text boxes and once you click preview the text is changed an d revealed as a layer above the product picture simulating your saying on a t-shirt.

I want to adopt the same concept but for helping my customers preview their jersey before they buy it. Can anyone help? i grabbed the source code from the text box used on another site hoping to figure out how to make this work:

<td><input tabindex="1" onKeyDown="textCounter(document.textUpdate.DS_Line1,document.textUpdate.remLen1,12);roll('ButUpadate', 'images/lang1/dsPreviewAni.gif')" onKeyUp="textCounter(document.textUpdate.DS_Line1,document.textUpdate.remLen1,12);roll('ButUpadate', 'images/lang1/dsPreviewAni.gif')" style="font-size:13px;color:#CA006C;padding:2px;width:145px;" maxlength="12" onclick="clickclear(this.form.DS_Line1, 'WHAT DOES');clickclear(this.form.DS_Line2, 'YOUR T-SHIRT');clickclear(this.form.DS_Line3, 'SAY?');" type="text" name="DS_Line1" size="20" value="WHAT DOES" /></td>
<td width="150">
<input onclick="clickclear(this.form.DS_Line1, 'WHAT DOES');clickclear(this.form.DS_Line2, 'YOUR T-SHIRT');clickclear(this.form.DS_Line3, 'SAY?');document.textUpdate.DS_Line1.focus();" type="text" style="width:17px; height: 15px; font: 13px Monospace, Verdana, Arial, sans-serif; color:#666666;padding:2px;" name="remLen1" value="12" size="1" readonly="readonly" /></td>
<td align="right">

but i am now seeing that i am way over my head.

maybe someone can help me? we're a new startup so we really dont have alot of cash, but we can advertise for you, and will put your company school or name forever linked to our business if you can help us. We can pay you something, but we think this job would be better suited for someone who wants to show people what they can do and make our project their own maybe for school..

please let me know soon, this kind of web design is beyond a simple e-commerce sql database guy, and thats unfortunately as good as i get.

09-03-2011, 08:03 AM
Share the working link

09-03-2011, 02:24 PM
okay, working preview pages located here:


09-03-2011, 02:47 PM
since this is a .asp web page that means they call to a server side html generator, would it be possible to do the same thing in java?

09-04-2011, 08:15 AM
I think the text in Urbanpup.com preview isn't a layer, nor overlayed; the text is injected as graphics pixels into the image. Also, it wouldn't be possible for javascript (or jQuery) to produce specific, uncommon fonts like Tipsy, BikerBones, etc.

So it must be handled server side. If you are using PHP, perhaps you might like to use GD library and install FreeType fonts?