: jquery UIコンポーネント使用後、ページが特定のdivでマスクされてスーパーリンクをクリックできなくなる問題について_html/css

: jquery UIコンポーネント使用後、ページが特定のdivでマスクされてスーパーリンクをクリックできなくなる問題について_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 11:28:22

オリジナル

1233 人が閲覧しました

jquery uiコンポーネントjqgirdを使用しました。
通常の表示効果は次のとおりです:

しかし、別のプロジェクトで使用したときに問題が発生しました。つまり、ページが半透明のレイヤーで覆われているように見え、ページの色が暗くなり、ナビゲーションバーが表示されなくなりました。暗くなり、クリックできなくなります。

問題のあるページ (ページ全体のほとんどの色が暗くなり、ナビゲーションバーのタグをクリックできない):

その他の通常のページ (jqgrid を使用していないページは通常の色で、ナビゲーションバーはクリックできません) Click):

マスキング効果を含む推定 div:

CSS:

添付ページコード:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><%	String path = request.getContextPath();	String basePath = request.getScheme() + "://"			+ request.getServerName() + ":" + request.getServerPort()			+ path + "/";%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html>	<head>		<base href="<%=basePath%>">		<title></title>		<meta http-equiv="pragma" content="no-cache">		<meta http-equiv="cache-control" content="no-cache">		<meta http-equiv="expires" content="0">		<meta http-equiv="keywords" content="vote">			<meta http-equiv="description" content="Voting System">		<link rel="stylesheet" type="text/css"			href="css/jquery-ui-1.9.2.custom.css" />		<link rel="stylesheet" type="text/css" href="css/ui.jqgrid.css" />		<link href="css/voteStyle.css" rel="stylesheet" type="text/css" />		<link href="css/ddsmoothmenu.css" rel="stylesheet" type="text/css" />		<script type="text/javascript" src="scripts/jquery-1.8.3.js"></script>		<script type="text/javascript" src="scripts/ddsmoothmenu.js"></script>		<script type="text/javascript"			src="scripts/jquery.KinSlideshow-1.2.1.js"></script>		<script type="text/javascript" src="scripts/webtry_roll.js"></script>		<script type="text/javascript" src="scripts/utils.js"></script>		<script type="text/javascript" src="scripts/jquery-ui-1.9.2.custom.js"></script>		<script type="text/javascript" src="scripts/jquery.jqGrid.src.js"></script>		<script type="text/javascript" src="scripts/grid.locale-cn.js"></script>			<script type="text/javascript">	$(document).ready(function() {		$("#gridTable").jqGrid({			url : 'getThemes.action',//获取数据的地址			datatype : "json",			height : 300,			autowidth : true,			colNames : [ '主题ID', '主题', '主题内容', '发起人' ],			colModel : [ {				name : "id",				index : "id",				label : "主题ID",				width : 30,				sortable : true,				resizable : true			}, {				name : "themeName",				index : "themeName",				label : "主题",				width : 50,				sortable : true,				resizable : true			}, {				name : "themeContent",				index : "themeContent",				label : "主题内容",				width : 120,				sortable : true,				resizable : true			}, {				name : "creator",				index : "creator",				label : "发起人",				width : 60,				sortable : false,				resizable : true			}, ],			sortname : 'themeID',			sortorder : 'desc',			viewrecords : true,			rowNum : 10,			rowList : [ 10, 20, 30 ],			jsonReader : {				root : "dataRows", // 数据行（默认为：rows）				page : "curPage", // 当前页				total : "totalPages", // 总页数				records : "totalRecords", // 总记录数				repeatitems : false			// 设置成false，在后台设置值的时候，可以乱序。且并非每个值都得设			},			prmNames : {				rows : "page.pageSize",				page : "page.curPageNo",				sort : "page.orderBy",				order : "page.order"			},			pager : "#gridPager",			caption : "我的投票",			onCellSelect : function(id) {				window.location.href = "test.html?id=" + id;			}		}).navGrid('#gridPager', {			edit : false,			add : false,			del : false		});	});</script>	</head>	<body>		<div id="mainW">			<div id="topSpace">				<div id="log">					<%						String USERID = (String) session.getAttribute("ID");						if (USERID == null) {							out.println("<a href='login.jsp' >登录</a>" + "|"									+ "<a href='register.jsp' >注册</a>");						} else {							out.println("<a href='logout.action' >退出系统</a>");						}					%>				</div>			</div>			<div id="menuSpace" class="ddsmoothmenu">				<ul>					<li>						<a href="index.jsp" title="主页" id="menu_selected"> <span>主页</span>						</a>					</li>					<%						if (USERID != null) {							out.println("<li><a href='ownTheme.jsp' title='我的主题'> <span>我的主题</span></a></li><li><a href='getUserData.action' title='资料管理'> <span>资料管理</span> </a></li>");							String USERTYPE = (String) session.getAttribute("USERTYPE");							if ("admin".equals(USERTYPE)) {								out.println("<li><a href='themeManagement.jsp' title='主题管理'> <span>主题管理</span></a></li><li><a href='addadmin.jsp' title='创建管理员'> <span>创建管理员</span></a></li>");							}						}					%>				</ul>			</div>			<div id="contentSpace">				<table id="gridTable"></table>				<div id="gridPager"></div>			</div>			<div id="copyright">				Copyright &copy;2012  BBB  All Rights Reserved.				<br />				<span>地址: </span>ZHBIT				<span>邮编: </span>519085				<br />				<span>联系人: </span>BBB				<span>手机: </span>123456				<br />				<span>邮箱: </span>bb@hotmail.com			</div>		</div>	</body>	</body></html>

ログイン後にコピー