好的,所以我很难在我的页面上设置Aweber表单的一部分。表单有一个按钮,用户单击该按钮即可加入邮件列表。我想在上面添加一些文字(这样我就可以A:B分开测试文本了)。我设置了第二个div并且绝对定位文本来完成这个,它完美地运行。
问题是当用户将鼠标悬停在按钮上时。文本在图像上的任何地方,它都会否定链接。请帮忙。
您可以在www.pregnantatlast.com
在线查看该页面以下是代码:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Pregnant At Last - Conditions that Stop Pregnancy, Solutions</title>
<!-- InstanceEndEditable -->
<style type="text/css">
</style>
<link href="style.css" rel="stylesheet" type="text/css" />
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
</head>
<body>
<div id="header">
<div id="header_txt">
Pregnant At Last
<h1>Increase Fertility - Get Pregnant - Naturally</h1>
</div>
<div id="menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="causes.html">Causes</a></li>
<li><a href="miscarriage.html">Miscarriage</a></li>
<li><a href="nutrition.html">Nutrition</a></li>
<li><a href="conditions.html">Conditions</a></li>
</ul>
</div><!--End menu-->
</div><!--End header-->
<!-- InstanceBeginEditable name="Content" -->
<div id="content_bg">
<div id="content">
<h1>Common fixable conditions often lead to infertility.</h1>
<div class="picture"> <img src="Assets/Images/44037990.jpg" width="301" alt="Couple with Doctor" />
</div>
<div id="caption">
<p>2/3 of all infertility cases are linked to the woman. Many can be helped.</p>
</div>
<div id="list">
<ul>
<li>Environmental factors are known to block conception</li>
<li>Some medical treatments alter sperm production and cause ovarian problems</li>
<li>Simple lifestyle changes can fix many conditions</li>
<li>How to breathe so your body heals itself</li>
<li>Herbs that help your body clense</li>
</ul>
<p> Learn what to <span>do</span> and more importantly, what <span> not to do</span>. </p>
<p> Heal your <span>body</span> and become <span>fertile</span> in no time! </p>
</div>
<!--End list-->
<div id="formbox">
<h2>Learn Secrets to Get Pregnant<br />Naturally in Months</h2>
<div id="formtxt">
<h3>Sign up for a FREE 7 day course and recieve:</h3>
<p>-10 Household Chemicals you Must Avoid</p>
<p>-Simple technique to double chances of conception</p>
<p>-Ways to help your parner increase his sperm count</p>
</div>
<!--End formtxt-->
<div id="form">
<!-- AWeber Web Form Generator 3.0 -->
<style type="text/css">
#af-form-69035635 .af-body .af-textWrap{width:98%;display:block;float:none;}
#af-form-69035635 .af-body input.text, #af-form-69035635 .af-body textarea{background-color:#FFFFFF;border-color:#919191;border-width:1px;border-style:solid;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-69035635 .af-body input.text:focus, #af-form-69035635 .af-body textarea:focus{background-color:#FFFAD6;border-color:#030303;border-width:1px;border-style:solid;}
#af-form-69035635 .af-body label.previewLabel{display:block;float:none;text-align:left;width:auto;color:#000000;text-decoration:none;font-style:normal;font-weight:normal;font-size:12px;font-family:Verdana, sans-serif;}
#af-form-69035635 .af-body{padding-bottom:0px;padding-top:5px;background-repeat:no-repeat;background-position:inherit;background-image:none;color:#000000;font-size:11px;font-family:Verdana, sans-serif;}
#af-form-69035635 .af-quirksMode{padding-right:10px;padding-left:10px;}
#af-form-69035635 .af-standards .af-element{padding-right:10px;padding-left:10px;}
#af-form-69035635 .buttonContainer input.submit{background-color:#c20606;background-image:url("http://www.pregnantatlast.com/Assets/Images/button_arrow3.jpg");color:#FFFFFF;text-decoration:none;font-style:normal;font-weight:normal;font-size:14px;font-family:Verdana, sans-serif;}
#af-form-69035635 .buttonContainer input.submit{width:auto;}
#af-form-69035635 .buttonContainer{text-align:center;}
#af-form-69035635 button,#af-form-69035635 input,#af-form-69035635 submit,#af-form-69035635 textarea,#af-form-69035635 select,#af-form-69035635 label,#af-form-69035635 optgroup,#af-form-69035635 option{float:none;position:static;margin:0;}
#af-form-69035635 div{margin:0;}
#af-form-69035635 form,#af-form-69035635 textarea,.af-form-wrapper,.af-form-close-
#af-form-69035635 img{float:none;color:inherit;position:static;background-color:none;border:none;margin:0;padding:0;}
#af-form-69035635 input,#af-form-69035635 button,#af-form-69035635 textarea,#af-form-69035635 select{font-size:100%;}
#af-form-69035635 select,#af-form-69035635 label,#af-form-69035635 optgroup,#af-form-69035635 option{padding:0;}
#af-form-69035635,#af-form-69035635 .quirksMode{width:329px;}
#af-form-69035635.af-quirksMode{overflow-x:hidden;}
#af-form-69035635{background-color:#FFFFFF;border-color:transparent;border-width:1px;border-style:solid;}
#af-form-69035635{display:block;}
#af-form-69035635{overflow:hidden;}
.af-body .af-textWrap{text-align:left;}
.af-body input.image{border:none!important;}
.af-body input.submit,.af-body input.image,.af-form .af-element input.button{float:none!important;}
.af-body input.text{width:100%;float:none;padding:2px!important;}
.af-body.af-standards input.submit{padding:4px 12px;}
.af-clear{clear:both;}
.af-element label{text-align:left;display:block;float:left;}
.af-element{padding:5px 0;}
.af-form-wrapper{text-indent:0;}
.af-form{text-align:left;margin:auto;}
.af-quirksMode .af-element{padding-left:0!important;padding-right:0!important;}
.lbl-right .af-element label{text-align:right;}
body {
}
</style>
<form method="post" class="af-form-wrapper" action="http://www.aweber.com/scripts/addlead.pl" >
<div style="display: none;">
<input type="hidden" name="meta_web_form_id" value="69035635" />
<input type="hidden" name="meta_split_id" value="" />
<input type="hidden" name="listname" value="4pregnantatlast" />
<input type="hidden" name="redirect" value="http://pregnantatlast.com/welcome.hmtl" id="redirect_6f08e83ce4f3bc074b25117c5105d14d" />
<input type="hidden" name="meta_redirect_onlist" value="http://pregnantatlast.com/welcome.hmtl" />
<input type="hidden" name="meta_adtracking" value="Pregnant_At_Last_Form" />
<input type="hidden" name="meta_message" value="1" />
<input type="hidden" name="meta_required" value="name,email" />
<input type="hidden" name="meta_tooltip" value="" />
</div>
<div id="af-form-69035635" class="af-form">
<div id="af-body-69035635" class="af-body af-standards">
<div class="af-element">
<label class="previewLabel" for="awf_field-42946097">Name: </label>
<div class="af-textWrap">
<input id="awf_field-42946097" type="text" name="name" class="text" value="" tabindex="500" />
</div>
<div class="af-clear"></div>
</div>
<div class="af-element">
<label class="previewLabel" for="awf_field-42946098">Email: </label>
<div class="af-textWrap">
<input class="text" id="awf_field-42946098" type="text" name="email" value="" tabindex="501" />
</div>
<div class="af-clear"></div>
</div>
<div class="af-element buttonContainer">
<input name="submit" id="af-submit-image-69035635" type="image" class="image" style="background: none;" alt="Submit Form" src="http://www.pregnantatlast.com/Assets/Images/button_arrow3.jpg" tabindex="502" />
<div class="af-clear"></div>
</div>
</div>
</div>
<div style="display: none;"><img src="http://forms.aweber.com/form/displays.htm?id=bJwMzKxszKw=" alt="" /></div>
</form>
<script type="text/javascript">
<!--
(function() {
var IE = /*@cc_on!@*/false;
if (!IE) { return; }
if (document.compatMode && document.compatMode == 'BackCompat') {
if (document.getElementById("af-form-69035635")) {
document.getElementById("af-form-69035635").className = 'af-form af-quirksMode';
}
if (document.getElementById("af-body-69035635")) {
document.getElementById("af-body-69035635").className = "af-body inline af-quirksMode";
}
if (document.getElementById("af-header-69035635")) {
document.getElementById("af-header-69035635").className = "af-header af-quirksMode";
}
if (document.getElementById("af-footer-69035635")) {
document.getElementById("af-footer-69035635").className = "af-footer af-quirksMode";
}
}
})();
-->
</script>
<!-- /AWeber Web Form Generator 3.0 -->
</div>
<!--End form-->
<div id="button_ttl"> Successful Pregnancy<br />
Starts Here </div>
<!--End button_ttl-->
</div>
<!--End formbox-->
<div id="arrow"> <img src="Assets/Images/red-arrow.png" width="252" height="415" alt="Arrow" /> </div>
<!--End arrow-->
<!--End content-->
</div>
<!--End content-->
</div>
<!--End content-->
</div><!--End content_bg-->
<!-- InstanceEndEditable -->
<div id="footer">
<div id="ft_menu">
<ul>
<li><a href="service.html">Terms of Service</a></li>
<li><a href="disclaimer.html">Disclaimer</a></li>
<li><a href="sitemap.html">Site Map</a></li>
<li><a href="privacy.html">Privacy Policy</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div><!--End ft_menu-->
<div id="foot_txt">
Pregnant At Last<br />
4043 Mahinahina Pl.<br />
Lahaina, HI 96761<br />
</div>
</div>
</body>
<!-- InstanceEnd --></html>
答案 0 :(得分:0)
我不是专家。 但我知道我的文字与图像有类似之处。 我用changin z-indexes
修复了它尝试使用正z-index
希望这会有所帮助。
这是关于z-index和图像链接的另一个堆栈: Link using z-index can't be clicked even though it's on top, in both Firefox & IE
答案 1 :(得分:0)
你错过了重定向页面。
变化:
<input type="hidden" name="redirect" value="http://pregnantatlast.com/welcome.hmtl" id="redirect_6f08e83ce4f3bc074b25117c5105d14d" />
要:
<input type="hidden" name="redirect" value="http://pregnantatlast.com/welcome.html" id="redirect_6f08e83ce4f3bc074b25117c5105d14d" />