2
我试图让我的摄影作品组合网站在所有主流浏览器（IE8，FF，Chrome）上正常工作，至今它的操作完美尽管我尽了全部努力，后面两个但是一些导航元素不会出现在IE8或9中。无法在IE8/9中使用悬停导航，在FF/Chrome中工作
你可以看到我在这里谈论，例如：http://element17.com/index.php?level=picture&id=88
左和最右边的图像100像素，当鼠标滑过时，应显示箭头，让您导航到相册中的前一张和下一张图像。在Firefox和Chrome中，这些按预期显示和操作。但在IE8/9中，它们不会显示。所有其他悬停信息显示正确。
<?php plogger_get_header(); ?>
<div id="big-picture-container">
<?php if (plogger_has_pictures()) : while(plogger_has_pictures()) :
plogger_load_picture();
$picture_caption = trim(plogger_get_picture_caption());
$detail_link = plogger_get_detail_link();
$prev_link = plogger_get_prev_picture_link();
$next_link = plogger_get_next_picture_link();
if ($picture_caption != '' || !isset($picture_caption)); ?>
<div class="picture-holder" style="width:<?php echo get_image_width(plogger_get_picture_id()); ?>;height:<?php echo get_image_height(plogger_get_picture_id()); ?>;">
<div class="hovering" style="position: absolute;margin: 0px;padding: 0px;top: 0px;left: 0px;z-index: 1000;width:<?php echo get_image_width(plogger_get_picture_id()); ?>;height:<?php echo get_image_height(plogger_get_picture_id()); ?>;">
<div class="exif-data">
<?php $wallpath = "";
$wallpath .= "plog-content/images/wallpaper/";
$wallpath .= $picture_caption;
$wallpath .= "Wide.jpg";
if (file_exists($wallpath)) {
echo "<span style='position:absolute; margin-top:1px;'><a href='plog-content/images/wallpaper/"; echo $picture_caption; echo "Wide.jpg'><img src='plog-content/images/wide.png' /></a></span><span style='position:absolute; margin-left:20px;'><a href='plog-content/images/wallpaper/"; echo $picture_caption; echo "Full.jpg' style='display:inline;'><img src='plog-content/images/full.png' /></a></span>";
}
$wallpath = ""; ?>
<h2><?php echo $picture_caption; ?></h2>
<?php echo plogger_get_picture_date(); ?><br />
<div class="exif"><?php echo generate_exif_table(plogger_get_picture_id()); ?></div>
</div>
<?php echo $prev_link; ?>
<?php echo $next_link; ?><img class="photos-large" src="<?php echo plogger_get_picture_thumb(THUMB_LARGE); ?>" alt="<?php echo $picture_caption; ?>" /></div>
</div>
</div>
</div>
<?php endwhile; else : ?>
<p>No such image</p>
<?php endif; plogger_get_footer(); ?>
我对混乱的内联样式道歉，这样......我还是试图清理一些这方面了，但我不相信任何的将是相关的。你也可以在这里看到样式表：http://www.element17.com/plog-content/themes/diffuser/gallery.css;我也很抱歉。 ：\
任何人都可以看到为什么会发生这种情况吗？我玩过Z指数，标签顺序和所有我能想到的东西，我无法想象为什么会发生这种情况。
谢谢大家！
编辑：
下面是最终呈现的HTML，为每个请求：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>City (Constructs, 2010) - Element17 Photography</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="imagetoolbar" content="false" />
<meta name="keywords" content="City" />
<meta name="description" content="" />
<link rel="stylesheet" type="text/css" href="http://element17.com/plog-content/themes/diffuser/gallery.css" />
<script type="text/javascript" src="http://element17.com/plog-content/themes/diffuser/dynamics.js"></script>
</head>
<body>
<div id="centering">
<div id="wrapper">
<div id="header"><table width="100%"><tr><td><a href="index.php"><img src="./plog-content/themes/diffuser/images/logo.png" alt="Element17 Photography" /></a></td><td align="right"><div id="breadcrumb-links"><a href="http://element17.com/index.php">Home</a> » <a accesskey="/" href="http://element17.com/index.php?level=collection&id=5">Constructs</a> » <a accesskey="/" href="http://element17.com/index.php?level=album&id=12">2010</a> » <span id="image_name"><strong>City</strong></span></div></td></tr></table></div>
<div id="main-container">
<div id="big-picture-container">
<div class="picture-holder" style="width:631px;height:950px;">
<div class="hovering" style="position: absolute;margin: 0px;padding: 0px;top: 0px;left: 0px;z-index: 1000;width:631px;height:950px;">
<div class="exif-data">
<h2>City</h2>
March 20, 2010<br />
<div class="exif"> Nikon D300, Tamron SP AF 17-50mm f/2.8 XR DiII VC @ 17 mm, f/9, 1/320 sec, ISO 200
</div>
</div>
<a id="prev-button" href="http://element17.com/index.php?level=picture&id=87"> </a> <a id="next-button" href="http://element17.com/index.php?level=picture&id=96"> </a><img class="photos-large" src="http://element17.com/plog-content/images/constructs/2010/20100320-dsc_5688.jpg" alt="City" /></div>
</div>
</div>
</div>
<div id="footer">
<div id="link-back">The photography and design of element17.com is copyright <b>© 2007-2011</b> by <b><a href="mailto:[email protected]">Steve Gaucher</a></b> and may not be reproduced/republished in any manner without prior consent.</div></div>
你应该向我们展示了渲染代码，由萤火虫/查看源代码的浏览器输出。 – Kyle 2011-02-23 07:13:44
@Kyle添加了呈现的代码。 – NaOH 2011-02-23 07:29:10
谢谢！我试图帮助你，但IE是无用的！ – Kyle 2011-02-23 07:40:41