On mobile the menu stays visible and blocks the view of the grid. Is there a way to hide the menu after clicking the submenu categories? I found a solution here for menus with no sub menus, but on this particular site I cannot get it to work, it either hides the submenus after clicking the parent item or does not work at all.
Site is here: http://www.process-comp.com/inventory.aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="inventory.aspx.vb" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head runat="server">
<title></title>
<telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server" />
<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
<link href="css/grid.css" rel="stylesheet" />
<script>
function onClientItemClicked(sender, eventArgs) {
sender.close(true);
}
</script>
</head>
<body>
<form id="form1" runat="server" style="height: 100%; width: 100%; margin: 0px;">
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
</Scripts>
</telerik:RadScriptManager>
<div style="height: 100%; width: 100%; margin: 0px; background-color: #ddd; position:fixed">
<telerik:RadSplitter ID="RadSplitter2" runat="server" Height="100%" Width="100%"
BorderSize="0" Orientation="Horizontal" Skin="BlackMetroTouch">
<telerik:RadPane ID="RadPane1" runat="server" Scrolling="None" Height="38px" ShowContentDuringLoad="false">
<div>
<telerik:RadMenu ID="RadMenu1" runat="server" Skin="BlackMetroTouch" Height="38px" CssClass="menu" RenderMode="Classic"
CollapseAnimation-Type="InExpo" ExpandAnimation-Type="OutExpo" DefaultGroupSettings-OffsetX="42" CollapseAnimation-Duration="200" ExpandAnimation-Duration="200" CollapseDelay="0" >
<Items>
<telerik:RadMenuItem Text="Select One ▼" CssClass="menuitem" GroupSettings-OffsetX="-1">
<Items>
<telerik:RadMenuItem CssClass="menusubitem-main" Text="Compression Equip. 1" GroupSettings-OffsetX="-184">
<Items>
<telerik:RadMenuItem OnClientItemClicked="onClientItemClicked" CssClass="menusubitem-full" Text="Blocks" Target="contentPane" NavigateUrl="inventory/blocks.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Camshafts" Target="contentPane" NavigateUrl="inventory/camshafts.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Cylinders">
<GroupSettings ExpandDirection="Down" />
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Ajax" Target="contentPane" NavigateUrl="inventory/ajax.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Ariel" Target="contentPane" NavigateUrl="inventory/ariel.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Cooper Bessemer">
<GroupSettings ExpandDirection="Down" />
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 0'' - 9.99''" Target="contentPane" NavigateUrl="inventory/cbgrp1.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 10'' - 19.99''" Target="contentPane" NavigateUrl="inventory/cbgrp2.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 20'' - UP" Target="contentPane" NavigateUrl="inventory/cbgrp3.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="All Sizes" Target="contentPane" NavigateUrl="inventory/cball.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Clark">
<GroupSettings ExpandDirection="Down" />
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 0'' - 9.99''" Target="contentPane" NavigateUrl="inventory/clarkgrp1.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 10'' - 19.99''" Target="contentPane" NavigateUrl="inventory/clarkgrp2.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 20'' - UP" Target="contentPane" NavigateUrl="inventory/clarkgrp3.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="All Sizes" Target="contentPane" NavigateUrl="inventory/clarkall.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Corken" Target="contentPane" NavigateUrl="inventory/corken.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Chicago Pnuematic" Target="contentPane" NavigateUrl="inventory/cp.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Delaval" Target="contentPane" NavigateUrl="inventory/delaval.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Gardner Denver" Target="contentPane" NavigateUrl="inventory/gd.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Gemini" Target="contentPane" NavigateUrl="inventory/gemini.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Hall" Target="contentPane" NavigateUrl="inventory/hall.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Ingersoll Rand">
<GroupSettings ExpandDirection="Down" />
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 0'' - 9.99''" Target="contentPane" NavigateUrl="inventory/irgrp1.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 10'' - 19.99''" Target="contentPane" NavigateUrl="inventory/irgrp2.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Bore 20'' - UP" Target="contentPane" NavigateUrl="inventory/irgrp3.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="All Sizes" Target="contentPane" NavigateUrl="inventory/irall.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="JA" Target="contentPane" NavigateUrl="inventory/ja.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Joy" Target="contentPane" NavigateUrl="inventory/joy.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Knight" Target="contentPane" NavigateUrl="inventory/knight.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Knox" Target="contentPane" NavigateUrl="inventory/knox.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Pennsylvania" Target="contentPane" NavigateUrl="inventory/penn.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Superior" Target="contentPane" NavigateUrl="inventory/superior.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Worthington" Target="contentPane" NavigateUrl="inventory/worth.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Cyl. Heads" Target="contentPane" NavigateUrl="inventory/compcylheads.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Cylinder Liners" Target="contentPane" NavigateUrl="inventory/cylliners.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Misc." Target="contentPane" NavigateUrl="inventory/compmisc.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Pistons" Target="contentPane" NavigateUrl="inventory/comppist.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Valves" Target="contentPane" NavigateUrl="inventory/compvalves.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Compressor Rods" Target="contentPane" NavigateUrl="inventory/comprods.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Coolers" Target="contentPane" NavigateUrl="inventory/coolers.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Crankshafts" Target="contentPane" NavigateUrl="inventory/cranks.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Crossheads" Target="contentPane" NavigateUrl="inventory/crossheads.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-main" Text="Compression Equip. 2" GroupSettings-OffsetX="-184" GroupSettings-OffsetY="-36">
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Engines" Target="contentPane" NavigateUrl="inventory/engines.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Engines Misc." Target="contentPane" NavigateUrl="inventory/enginesmisc.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Frames" Target="contentPane" NavigateUrl="inventory/frames.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Gas Compressors" Target="contentPane" NavigateUrl="inventory/gascomp.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Manifolds" Target="contentPane" NavigateUrl="inventory/manifolds.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Master Rods" Target="contentPane" NavigateUrl="inventory/mastrods.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Motors" Target="contentPane" NavigateUrl="inventory/motors.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Power Cylinders" Target="contentPane" NavigateUrl="inventory/powcyls.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Power Cylinder Heads" Target="contentPane" NavigateUrl="inventory/powcylhds.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Power Pistons" Target="contentPane" NavigateUrl="inventory/powpist.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Power Rods" Target="contentPane" NavigateUrl="inventory/powrods.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Turbos" Target="contentPane" NavigateUrl="inventory/turbos.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-main" Text="Process Equipment" GroupSettings-OffsetX="-184" GroupSettings-OffsetY="-72">
<Items>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Chillers" Target="contentPane" NavigateUrl="inventory/chillers.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Columns" Target="contentPane" NavigateUrl="inventory/columns.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Coolers" Target="contentPane" NavigateUrl="inventory/coolers.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Filters" Target="contentPane" NavigateUrl="inventory/filters.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Glycol Units" Target="contentPane" NavigateUrl="inventory/glycol.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Heaters" Target="contentPane" NavigateUrl="inventory/heaters.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Heat Exchangers" Target="contentPane" NavigateUrl="inventory/heatex.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Horizontal Vessels" Target="contentPane" NavigateUrl="inventory/horizontal.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Motors" Target="contentPane" NavigateUrl="inventory/motors.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Plants" Target="contentPane" NavigateUrl="inventory/plants.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Process Misc." Target="contentPane" NavigateUrl="inventory/promisc.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Pumps" Target="contentPane" NavigateUrl="inventory/pumps.aspx"></telerik:RadMenuItem>
<telerik:RadMenuItem CssClass="menusubitem-full" Text="Vertical Vessels" Target="contentPane" NavigateUrl="inventory/vertical.aspx"></telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
</Items>
</telerik:RadMenuItem>
</Items>
</telerik:RadMenu>
<a class="exit" href="index.html">EXIT</a>
</div>
</telerik:RadPane>
<telerik:RadPane ID="contentPane" runat="server" ContentUrl="inventory/invlanding-full.aspx"
Width="100%" TabIndex="2" ShowContentDuringLoad="false">
</telerik:RadPane>
</telerik:RadSplitter>
</div>
</form>
</body>
</html>