In-field labels plugin not working [closed]

This question is unlikely to help any future visitors; it is only relevant to开发者_如何学运维 a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center. Closed 11 years ago.

I am trying to use the In-field labels plugin on the contact form of my webpage, but the script is not working (the in-field labels don't appear).

Also my form has positioning problems that I have been trying to work with for a while but in vain. Here is my code:

$(function(){
    $("label").inFieldLabels();
});

<form action="" method="get" name="contact-form" accept-charset="utf-8">
    <fieldset>
    <p>
        <label for="name">Name</label><br />
        <input type="text" name="name" value="Name" id="name">
    </p>
    <p>
        <label for="email">Email</label><br />
        <input type="text" name="email" value="Email" id="email">
    </p>
    <p>
        <label for="company">Company</label><br />
        <input type="text" name="company" value="Company" id="company">
    </p>
    <p>
        <label for="message">Message</label><br />
        <textarea name="message" id="message">Message</textarea>
    </p>
    </fieldset> 
    <input type="submit" value="Submit" id="submit-btn" />
    <input type="reset" value="Reset" id="reset-btn" />
</form>

---

I see you used the following code for textarea :

<textarea name="message" id="message" value="Message"></textarea>

but

<textarea id="mytxtarea"></textarea>

has no value property. if you want to add text within textarea then try with this

<textarea name="message" id="message">Message</textarea>

---

You need to get rid of the values of all inputs for this to work. They should be value="".

Using IE 9 Developer Tool, I see that you have the following CSS showing up for the <p> tag around the input fields:

body#contact .content #middle #right-col #form p {

left: -300px;
top: 22px;
color: #aaaaaa;
position:relative;

}

Get rid of that -300px. In IE it pushes the input fields off the form.

Edit: Okay, I think I've fixed it! Get rid of the left: -300px; offset for the <p> elements and add a clear: both; to the fieldset element. I tested it in IE and FF and it seemed to work just fine.