Hi有一个jquery驱动的小条目表单。它在90%的页面上运行良好,但在两个页面上,“提交”按钮不对齐。我已经检查了工作页面和非工作页面上的html和jquery,看不出有什么区别。我希望有另一双眼睛看看是什么导致提交按钮如此遥远。
这是一个工作页(滚动到新闻稿注册表单的底部):
view page
这是一个不正常的页面:
view page
<div id="news-signup">
    <div id="entry">
      <input type="text" id="your-email" name="your-email" value="YOUR EMAIL ADDRESS" onfocus="if (this.value=='YOUR EMAIL ADDRESS') this.value='';" />
      <input type="submit"  value="::Submit Query::" id="red-submit" />
    </div>
   </div>
下面是执行交换的jquery:
$(document).ready(function() {
   var emailInput = $("#your-email");
   emailInput.focus(function() {
     //  THREE = !
     if(this.value === "YOUR EMAIL ADDRESS") {
       this.value = "";
     }
   });
   emailInput.blur(function() {
     if(this.value === "") {
       this.value = "YOUR EMAIL ADDRESS";
     }
   });
   $("#red-submit").click(function() {
     $.ajax({
       type: 'POST',
       url: 'news.php',
       data: {
         'your-email': emailInput.val()
       },
       success: function() {
         var image = $('<img />').attr({src:'_images/register-thanks.png', width:332, height:35, alt:"Success"});
         $('#news-signup input').hide();
         $('#news-signup').append(image);        Â
       }
     });
   });
});
这里是用于定位的CSS:
#news-signup #entry,
#news-signup form {
width:335px;
height:35px;
position: absolute;
top: 52px;
left: 590px;
}
#news-signup input#your-email {
width: 195px;
height: 20px;
position: relative;
top: 5px;
left: 0;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border: 1px solid #cbcbcb;
font: 14px "Trebuchet MS", Helvetica, sans-serif;
color: #cbcbcb;
}
#news-signup img { position: absolute; top: 50px; left: 600px; }
input#red-submit {
width: 90px;
height: 30px;
border-style: none;
text-indent: -9999px;
position: relative;
top: -20px;
left: 250px;
cursor: pointer;
font-size: 0;
line-height: 0;
background-color: transparent;
background-image: url(../_images/btn_submit-red.png);
}