正确使用jQuery效果

Question

我正在使用jQuery弹跳效果来验证表单条目。当文本字段反弹就失去它的CSS属性： 原文：

在效果：

HTML：

<span class='notify'> 
     <span class='getin'>Get in early</span> 
     <input type='text' id='inviteEmail' placeholder='Enter email'/> 
     <a href='#' name='email' id='invite-all' onclick='notifyEmail();' class='btn'>Notify Me</a> 
     </span> 

CSS：

.notify { 
    position: absolute; 
    bottom: 0; 
    padding-left: 50px; 
} 

a.btn { 

    padding: 6px 7px; 
    background: #000000; 
    color: #3be2da !important; 
    border: 2px solid rgba(33, 68, 72, 0.59); 
    border-radius: 7px; 
    -moz-border-radius: 7px; 
    -webkit-border-radius: 7px; 
    text-align: center; 
    text-decoration: none; 
    font: bold 14px; 
    margin-left: 10px; 
} 
a.btn:hover { 
    background: #3d7a80; 
} 
span.getin { 
    font: bold 16px Tahoma; 
    margin-right: 35px; 
} 
input[type='text']{ 
    text-align:center; 
    font-weight: bold; 
    width: 220px; 
    height: 35px; 
    -webkit-border-radius: 7px; 
    -moz-border-radius: 7px; 
    border-radius: 7px; 
    border: 2px solid #616565; 
    font-size: 18px; 
} 

a.invitelink { 
    padding: 6px 7px; 
    background: #000000; 
    color: #3be2da !important; 
    border: 2px solid rgba(33, 68, 72, 0.59); 
    border-radius: 7px; 
    -moz-border-radius: 7px; 
    -webkit-border-radius: 7px; 
    text-align: center; 
    text-decoration: none; 
    font: bold 14px Tahoma,Helvetica, Geneva, sans-serif; 
    margin-left: 10px; 
} 

而且我将如何清除文本框后效果并保留占位符文本？

Answer 1

添加

.notify .ui-effects-wrapper { 
    display: inline-block; 
} 

要你的样式表：

http://jsfiddle.net/7rCZW/