【发布时间】:2011-01-11 04:10:50
【问题描述】:
我在on a site 工作,在 Jquery Tools Tooltip (http://flowplayer.org/tools/tooltip/index.html) 生成的标题上有弹出窗口。我对他们的问题是双重的:
1) 在 IE7/IE8 中,弹出窗口在页面加载时可见,导致页眉分开并分散在页面上。我写的 CSS 应该可以防止这种情况(它在 FF 中是这样),但它不起作用:
#container > section > header .trigger + *{
position:absolute;
left:-9999px;
z-index:1000;
}
由于未知的原因,如果我在 UL 中使用类 .trigger 将元素包装在元素下方,IE 会非常高兴。这是我最初设置 HTML 的方式,但我最终使用了 Jquery 选项卡并从 CSS 中清除了标题中提到的所有列表,所以我不知道为什么会这样。
2) 我的第二个问题是,当提交“写给我们”标题下的弹出窗口中的表单时,标题消失了,内容容器发生了变化。应该发生的是“谢谢”消息应该加载到联系表单所在的同一个弹出窗口中。由于表单是由我正在使用的 CMS 中的插件生成的,因此我理想地希望解决这个问题无需想办法让 JS 拦截插件的输出,但如果有必要我会。
这是表单的代码:
<form method="post" id="zcrc4246f0a2add167f83d1d4084631a0b4" class="zemContactForm" action="/qp2txp/#zcrc4246f0a2add167f83d1d4084631a0b4">
<div>
<input type="hidden" name="zem_contact_nonce" value="735c856baeffe5da43125cbf5a628084" />
<input type="hidden" name="zem_contact_form_id" value="c4246f0a2add167f83d1d4084631a0b4" />
<label for="Name" class="zemText zemRequired Name">Name</label><input type="text" id="Name" class="zemText zemRequired" name="Name" value="" maxlength="100" />
<label for="Email" class="zemText zemRequired Email">Email</label><input type="text" id="Email" class="zemText zemRequired" name="Email" value="" maxlength="100" />
<label for="Project" class="zemSelect zemRequired Project">Project</label>
<select id="Project" name="Project" class="zemSelect zemRequired">
<option>Branding</option>
<option>Print</option>
<option>Web</option>
<option>Interiors</option>
<option>Other (Please Describe)</option>
</select>
<label for="Message" class="zemTextarea zemRequired Message">Message</label><textarea id="Message" class="zemTextarea zemRequired" name="Message" cols="58" rows="8"></textarea><br>
<input type="submit" class="zemSubmit" name="zem_contact_submit" value="Send" />
</div>
</form>
还有 Jquery:
<script>
$(document).ready(function() {
$("header .trigger").tooltip({
position: 'bottom center',
offset: [30, -60],
relative: 'true',
delay: '70'
});
$("footer .trigger").tooltip({
position: 'top left',
offset: [-40, 100],
relative: 'true',
delay: '70'
});
});
</script>
任何帮助将不胜感激。我被难住了。
【问题讨论】:
标签: javascript jquery css internet-explorer