cforms II User Forum
 
Current User: Guest FAQs
Search Forums:


 






Minimum search word length is 4 characters – Maximum search word length is 84 characters
Wildcard Usage:
*  matches any number of characters    %  matches exactly one character

cforms II User Forum CSS Styling and Layout Changing Background Image on Error

Changing Background Image on Error
Page:   1   Reply to Post Add a New Topic
Post
Guest

Derek Perkins

7:12 pm January 9, 2009
  Quote and Reply
1

I have a CSS background image that I use to style my text input boxes.  I'd like to change that image when there is an error on input.  Specifically, I'd like to have a one field form in the header of my site where someone can sign up for an email newsletter, so I don't want to use any extra space for messages.  How would I do that?
Admin

Oliver

Munich, Germany

posts 6231

8:37 pm January 9, 2009
  Quote and Reply
2

I can neither see an image nor text boxes.

** FAQS   ** cforms home page   ** donations
Guest

Derek Perkins

1:01 am January 11, 2009
  Quote and Reply
3

My development website is at – http://derekperkins.com/seatability

Specifically, I have #search and #header #email in my header.  The search is powered by a standard form, while the email is powered by cforms.  The image background consists of three different states: normal, hover and error.  On hover, I move the image up 25 pixels.  On an error, I'd like to move the same background image up 51 pixels and not display any text warnings.  What is the best way to accomplish that?

Thank you so much for your help and your great plugin.
Admin

Oliver

Munich, Germany

posts 6231

12:38 pm January 11, 2009
  Quote and Reply
4

Very similar like you'd do it for any other HTML element on your site.

You can access each cforms element by it's ID, e.g. #cf_field_1 for your header email field.

PS: if you'd like to use entirely your own CSS to style the (c)form, you can turn cforsm CSS off altogether (under Styling) .

** FAQS   ** cforms home page   ** donations
Guest

Derek Perkins

1:26 am January 12, 2009
  Quote and Reply
5

It isn't the CSS that I'm not sure what to do with, it's how to hook into the CForms error so that I know when to apply the error class.  What's the best way to do that?
Admin

Oliver

Munich, Germany

posts 6231

7:37 am January 12, 2009
  Quote and Reply
6

unless you change the code, you can't 'hook' into the cforms error code-wise.

try via CSS:

for all:

input.cf_error { … }

or, e.g for one particular row/field:

#li–1 input.cf_error { … }

** FAQS   ** cforms home page   ** donations
No Tags
Page:   1   Reply to Post

Reply to Topic:
Changing Background Image on Error

PLEASE READ THE FAQs FIRST! THANK YOU.

Guest Name (Required):

Guest Email (Required):

NOTE: New Posts are subject to administrator approval before being displayed

Smileys
lol offended sad ??? yell cry frown kiss surprised wink innocent smile oops cool
Post New Reply

Guest URL (required)

Math Required!
What is the sum of:
10 + 1    

Topic RSS

About the delicious:days Forum

Forum Timezone: Europe/Berlin

Currently Online:
47 Guests

Currently Browsing this Topic:
1 Guest