4 replies to this topic

[Celox]

Hey all,

I need the login fields as an image and still be able to put text on it. As you can see on my site [url="http://www.celoxdesigns.com"]celoxdesigns[/url] I really need it cause the default login looks really bad on that metal. This is te code i got now, I'll name the things i tried after the working code.

[quote]<input name="ws_user" type="text" class="form_username" onFocus="this.className='form_on'" onBlur="this.className='form_off'" size="16"><br />
<input name="pwd" type="password" class="form_password" onFocus="this.className='form_on'" onBlur="this.className='form_off'" size="16">

<input type="submit" name="Submit" value="login">[/quote]

Things i tried:

[quote]<input name="ws_user" type="image" src="name.gif" class="form_username" onFocus="this.className='form_on'" onBlur="this.className='form_off'" size="16"><br />
<input name="pwd" type="image" src="password.gif" class="form_password" onFocus="this.className='form_on'" onBlur="this.className='form_off'" size="16">

<input type="submit" name="Submit" value="login">[/quote]

[u]I also tried[/u]:
- to remove the onfocus and onblur tag but didn't work.
- type="text" src="name.gif/password.gif"

If anyone could help me out that would be great, oh and btw i googled it and didn't find it, only found the way on how to do the submit button as an image.

Thanks in advance,

Celox

[greg]

Add this inside the input tag:

style="background: url(image.gif) top left no-repeat;border:1px #000;"

Replace "image.gif" with an image to be placed as the field's background. You can make border 0px if you want.

[Celox]

Thanks alot greg, that works great!

Celox

[greg]

No problem, glad I was helpful.

By the way, you can also add margin-top: 4px; inside style="" to add some spacing between the form vields. Also, I'm not 100% sure on this, but I think you can add this to the input tag so that there is initial text in the form field to let the users know what it's for:

value="Username"

value="Password"

[Celox]

Yeah that works, i had it also in the old code at the submit button.
Thanks again for ur fast replies.

Celox