Transparent Text boxes.

@chrizOct 11.2004

I only know a bit of CSS, but i was looking for a script that lets a text box have a ‘see-through’ background, but so you can see the text.
You see, i want a text-box/DIV box actually ON an image, using javascript the user clicks on a button asks him for data click on OK and the data will be displayed on the image, but i don’t want a solid background on the text-box, so would there be anyway that i can get the trnsparent background??

to post a comment

CSS

@zaclaneOct 11.2004 — ##div{

background-color:transparent;

}

That will give your div a tranrsarent background.

Cheers zaclane

Sorry I read the post wrong.

I'm not sure if that works for a text box.

:o

@chrizauthorOct 11.2004 — #Ahh! Thanks a lot!

tis OK, i can use :

<input type="text" value="" [COLOR=crimson]style="background-color:tansparent"[/COLOR]>

i'd just shove a style thing i the text box. Thanks again! - ~ Chriz

@BonRougeOct 11.2004 — #Edit: sorry, I think I misread it too... For what it's worth...

Something like [URL=http://cheers-sendai.com/text-on-pic.htm]this ?[/URL]

[CODE]<?xml version="1.0" encoding="Shift_JIS"?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>Text on pic</title>
 <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
 <style type="text/css">
 .pic {position:absolute; left:100px; top:100px; width:100px; height: 100px; font-weight:bold;}
 </style> 
 </head>
 <body>
 <img src="wine.png" class="pic" alt="" />
 <div class="pic">
 <p>This text is on top of the picture.</p>
 </div>
 </body>
 </html>[/CODE]

This is just like using a background...

To be more precise with your text you could split these up like [URL=http://cheers-sendai.com/text-on-pic2.htm]this[/URL] :

[CODE]
 <style type="text/css">
 #pic {position:absolute; left:100px; top:100px; width:100px; height: 100px;}
 #text {position:absolute; left:110px; top:130px; width:100px; height: 100px; font-weight:bold;}
 </style> 
 </head>
 <body>
 <img src="wine.png" id="pic" alt="" />
 <div id="text">
 <p>This text is on top of the picture.</p>
 </div>
 </body>
 [/CODE]

@chrizauthorOct 11.2004 — #Thanks guys! I think i best stay with using a txtbox 'cos i can use javascript easier then, i dunno how to write into a DIV thing using javascript.

Thanks 4 the help!

Transparent Text boxes.

4 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

Transparent Text boxes.

4 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #CSS _↴