我正在开发一个在IE11除外的每个网络浏览器中正常运行的网站。问题是我链接到另一个页面的任何图像都被禁用（即徽标图像，菜单链接）。
我已将罪魁祸首缩小为使用jquery的响应式菜单javascript（jPushMenu）。我有一个小提琴，我把所有东西都拆掉了：
https://jsfiddle.net/cy83v725/
这是我的HTML代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,IE=11,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="css/davincid.css" type="text/css" media="all" />
<link rel="stylesheet" type="text/css" href="slick-1.5.7/slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="slick-1.5.7/slick/slick-theme.css"/>
<!--[if IE 7]>
<link rel="stylesheet" type="text/css" href="css/davincid-ie7.css">
<![endif]-->
<link rel="stylesheet" href="css/jPushMenu.css" type="text/css" media="all" />
<link rel="stylesheet" href="font-awesome-4.4.0/css/font-awesome.min.css" type="text/css" media="all" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<title>DaVinci Digital | Innovative, Complete IT Solutions</title>
</head>
<body id="home">
<div class="wrapper">
<!-- Responsive design starts here -->
<!-- Left menu element-->
<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-left">
<h3><a><i class="fa fa-times"></i> Close Menu</a></h3>
<a href="index.html">Home</a>
<a href="who-we-are.html">Who We are</a>
<a href="what-we-do.html">What We Do</a>
<a href="your-team.html">Your Team</a>
<a href="our-clients.html">Our Clients</a>
<a href="helpdesk.html">DaVinci Helpdesk</a>
<a href="contact.html">Contact</a>
</nav>
<div id="button">
<button class="btn toggle-menu menu-left push-body"><i class="fa fa-bars"></i> MENU</button>
</div>
<div id="DDLogoRsp">
<a href="index.html"><img src="images/Davincid-logo.gif" class="logo" alt="DaVinci Digital" /></a>
</div>
<div class="pageTitleResponsive">
</div>
<div id="ContentArea">
<div class="indexRsp">
<div class="resp-slideshow"/>
</div>
<div class="tagline">
<img class="resp" src="images/tag.gif" align="right" alt="Providing 100% referral based professional services since 1993"/>
</div>
</div>
</div>
<!-- Responsive design ends here -->
<div id="main">
<div id="DDLogo">
<div id="headWrapper">
<div class="logo">
<a href="index.html"><img src="images/Davincid-logo.gif" align="left" alt="DaVinci Digital" /></a>
</div>
</div>
<ul id="NavContainerAlt">
<li id="whoWeAre"><a href="who-we-are.html"></a></li>
<li id="whatWeDo"><a href="what-we-do.html"></a></li>
<li id="contact"><a href="contact.html"></a></li>
<br class="clear">
</ul>
<div id="indexContentArea">
<div class="slideshow" align="center">
</div>
</div>
</div>
<div class="tagline">
<img class="resp" src="images/tag.gif" align="right" alt="Providing 100% referral based professional services since 1994"/>
</div>
<div class="DDrawing">
<img src="images/davinci-drawing.jpg" alt="Davinci"/>
</div>
</div>
<div id="Footer">
<p class="Footer">©2016 DaVinci Digital All Rights Reserved.</p>
<p class="Footer"> </p>
</div>
<!--load jQuery, required-->
<script src="js/jquery-1.9.1.min.js"></script>
<!--load jPushMenu, required-->
<script src="js/jPushMenu.js"></script>
<!--call jPushMenu, required-->
<script>
jQuery(document).ready(function($) {
$('.toggle-menu').jPushMenu();
});
</script>
</body>
</html>
这是jPushMenu javascript：
/*!
* jPushMenu.js
* 1.1.1
* @author: takien
* http://takien.com
* Original version (pure JS) is created by Mary Lou http://tympanus.net/
*/
(function($) {
"use strict";
$.fn.jPushMenu = function(customOptions) {
var o = $.extend({}, $.fn.jPushMenu.defaultOptions, customOptions);
$('body').addClass(o.pushBodyClass);
// Add class to toggler
$(this).addClass('jPushMenuBtn');
$(this).click(function(e) {
e.stopPropagation();
var target = '',
push_direction = '';
// Determine menu and push direction
if ($(this).is('.' + o.showLeftClass)) {
target = '.cbp-spmenu-left';
push_direction = 'toright';
}
else if ($(this).is('.' + o.showRightClass)) {
target = '.cbp-spmenu-right';
push_direction = 'toleft';
}
else if ($(this).is('.' + o.showTopClass)) {
target = '.cbp-spmenu-top';
}
else if ($(this).is('.' + o.showBottomClass)) {
target = '.cbp-spmenu-bottom';
}
if (target === '') {
return;
}
$(this).toggleClass(o.activeClass);
$(target).toggleClass(o.menuOpenClass);
if ($(this).is('.' + o.pushBodyClass) && push_direction !== '') {
$('body').toggleClass(o.pushBodyClass + '-' + push_direction);
}
// Disable all other buttons
$('.jPushMenuBtn').not($(this)).toggleClass('disabled');
return;
});
var jPushMenu = {
close: function (o) {
$('.jPushMenuBtn,body,.cbp-spmenu')
.removeClass('disabled ' + o.activeClass + ' ' + o.menuOpenClass + ' ' + o.pushBodyClass + '-toleft ' + o.pushBodyClass + '-toright');
}
};
// Close menu on clicking outside menu
if (o.closeOnClickOutside) {
$(document).click(function() {
jPushMenu.close(o);
});
}
// Close menu on clicking menu link
if (o.closeOnClickLink) {
$('.cbp-spmenu a').on('click',function() {
jPushMenu.close(o);
});
}
};
/*
* In case you want to customize class name,
* do not directly edit here, use function parameter when call jPushMenu.
*/
$.fn.jPushMenu.defaultOptions = {
pushBodyClass : 'push-body',
showLeftClass : 'menu-left',
showRightClass : 'menu-right',
showTopClass : 'menu-top',
showBottomClass : 'menu-bottom',
activeClass : 'menu-active',
menuOpenClass : 'menu-open',
closeOnClickOutside: true,
closeOnClickLink : true
};
})(jQuery);
这对我来说很困惑：
我是javascript的新手，所以非常感谢任何帮助！
答案 0 :(得分：0)
您的HTML存在许多问题，包括可能会混淆事物的自闭式div。我相信通过从你的html和body元素中取出z-index: -5可以解决眼前的问题。