0

私のコードには、単純な css/jquery メニューとgoogle.visualization.PieChartの両方があります。しかし最近、私の円グラフがメニューを覆っているのを見ました。つまり、メニューをドロップダウンすると、円グラフの後ろの部分を除いてすべてが表示されます (以下の例では、メニューに技術マニュアルが表示されません)。

ここに画像の説明を入力

誰かがhtml/css/jsコードで何を変更すべきかアドバイスできれば、とても感謝しています。

必要ないかもしれませんが、完全を期すために、私の問題を示すコードのサンプルを以下に示します。jquerycssmenu.cssとjquerycssmenu.jsをdynamicdriveからダウンロードして実行する必要があります。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-2">
<meta name="robots" content="index,follow">

<title>Test Site</title>
<link rel="stylesheet" type="text/css" charset="utf-8" media="all" href="./common.css">
<link rel="shortcut icon"  href="./favicon.gif" type="image/gif" />

<script type="text/javascript" src="https://www.google.com/jsapi"></script>

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Task');
        data.addColumn('number', 'Hours per Day');
        data.addRows([
          ['Work', 11],['Eat',  2],['Commute', 2],['Watch TV', 2],['Sleep', 7]
        ]);
        var options = {
          title: 'My Daily Activities'
        };

        var chart = new google.visualization.PieChart(document.getElementById('chartClient_Group_all_div'));
        chart.draw(data, options);
      }
    </script>


<link rel="stylesheet" type="text/css" href="jquerycssmenu.css" />
<script type='text/javascript' src='js/jquery-1.2.6.min.js'></script>
<script type="text/javascript" src="jquerycssmenu.js"></script>

</head>

<body  lang="en" dir="ltr">

<!-- ================= HEADER ================= -->

<div id="myjquerymenu" class="jquerycssmenu">
<ul>
   <li><a href="./resources.php">Resources</a>
   <ul>
      <li><a href="./resourcesQ.php">Infos on Queue</a>
      <li><a href="./resourcesH.php">Infos on Hardware</a>
      <li><a href="./resourcesS.php">Software manuals</a>
      <li><a href="./resourcesT.php">Technical manuals</a>
   </ul>
   </li>
</ul>
</div> 

<div id="naviline"><hr style="display:none;"></div>

<div id="page">
   <TABLE border="1" BORDERCOLOR=white class="t0"><tr>
   <td align="left" valign="top" width="500px" style="border-style: none; background: white;">
      <center><h4> Some Title</h4><br>
      <div id="chartClient_Group_all_div"> </div>
   </td>
   </tr></table>
<br>
</div> <! -- page -- >
</body>
</html>
4

1 に答える 1

1

メニューの z-index css プロパティを円グラフより高く設定する必要があります。9999 か​​ら始めてみてください。

于 2012-04-05T21:07:37.683 に答える