J'ai une page avec un jeu de cadres composé de deux cadres; un cadre supérieur et un cadre inférieur. Le cadre supérieur a un menu avec des sous-menus. Le problème que j'ai est que le cadre inférieur ne permet pas aux sous-menus de tomber comme ils le devraient. Je pourrais augmenter la taille du cadre supérieur mais la direction ne le veut pas. Comme il ne semble pas possible d'avoir le menu déroulant sur le menu du bas, la meilleure façon de le faire fonctionner est de cacher le cadre du bas tout en agrandissant le cadre supérieur. Ceci est la théorie seulement si. Je n'ai jamais travaillé avec asp.net ou des cadres avant ainsi, pour être honnête, je ne suis pas sûr si cela fonctionnera ou non.Essayer de masquer une image avec jquery lorsque le menu est survolé
Il y a une page séparée pour les cadres et les cadres et il ressemble à ceci:
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="dhss.mohsaic.webapplication.mohsaic.DefaultFrameset" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<head>
<title>MOHSAIC</title>
<link rel="shortcut icon" href="/Images/bavicon.ico"/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0" />
<meta name="CODE_LANGUAGE" content="Visual Basic 7.0" />
<meta name="vs_defaultClientScript" content="JavaScript" />
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5" />
</head>
<frameset border="0" framespacing="0" rows="95,*" name="frameset" class="frameset" id="frameset">
<frame src="<%=HeaderFrameURL%>" scrolling="no" frameborder="0" noresize="noresize" name="fraHeader" />
<frame src="<%=EntireBodyURL%>" scrolling="auto" frameborder="0" noresize="noresize" name="fraEntireBody" id="bottomFrame" />
</frameset>
</html>
Le code HTML du menu, qui, dans un fichier séparé est:
<div>
<table id="tblAreaTabs" style="padding-right: 0px; padding-left: 0px; padding-bottom: 0px;
margin: 0px; padding-top: 0px" cellspacing="0" cellpadding="0" width="100%" border="0">
<tbody>
<tr>
<td class="DarkHeader" width="100%" bgcolor="#000000">
<asp:Menu ID="mainMenu" Runat="server" Orientation="Horizontal"
DynamicMenuItemStyle-CssClass="ChildLink" StaticMenuItemStyle-Font-Underline="true" StaticMenuItemStyle-CssClass="ParentLink" StaticEnableDefaultPopOutImage="false"
style="text-align:center;filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=2, OffY=2, Color='black', Positive='true');">
</asp:Menu>
</td>
<td valign="middle" class="DarkHeader">
<asp:HyperLink ID="hlError" runat="server" NavigateUrl="DssStatus.aspx" Target="fraDssStatus"
ImageUrl="/images/error.gif" BorderWidth="0px" Height="15px">The connection to DSS is not available.</asp:HyperLink><asp:HyperLink
ID="hlWarn" runat="server" NavigateUrl="DssStatus.aspx" Target="fraDssStatus"
ImageUrl="/images/warn.gif" BorderWidth="0px" Height="15px">The connection to DSS is partially available. </asp:HyperLink>
</td>
</tr>
</tbody>
</table>
</div>
les sous-menus sont créés dynamiquement en fonction des identifiants de connexion de l'utilisateur
J'ai essayé plusieurs façons de faire ce que je veux faire. Le premier était d'ajouter onmouseover = "whileHovering()" à l'asp: tag menu et ajouter le javascript suivant:
var origCols = null;
function whileHovering() {
//alert("Yes, I'm working");
if (origCols !== null)
showFrame();
else
hideFrame();
};
function hideFrame() {
var frameset = parent.document.getElementById("frameset");
origCols = frameset.rows;
frameset.rows = "120, 0";
};
function showFrame() {
document.getElementById("frameSet").rows = origCols;
origCols = null;
};
Cependant, cela ne fonctionne pas. Je reçois l'erreur 'Impossible de lire la propriété' rows 'de null. Après avoir enquêté, le frameset est nul et rien de ce que je faisais ne changerait cela. J'ai donc donné sur cette route et essayé:
(function() {
alert("I have entered the function")
$('#mainMenu').hover(function() {
alert('hidden function working')
$(this).parent.document.getElementById('bottomFrame').style.visibility = "hidden"
}), function() {
alert('visible function working')
$(this).parent.document.getElementById('bottomFrame').style.visibility = "visible"
}
});
Je reçois aucune erreur de cela, mais rien ne se passe. Il ne frappe même pas la fonction anonyme.
J'apprécierais que quelqu'un puisse me dire ce que je fais mal.
Ah tirer. Cela explique pourquoi il n'entrait pas dans la fonction. Je vous remercie.Donc, il entre dans la fonction, puis entre dans la fonction pour cacher le cadre lorsque je le survole. Malheureusement, cela ne fait rien. J'ai essayé votre code et cela fonctionne mais cela fonctionne sur le mauvais cadre. J'ai besoin de cacher le cadre inférieur. Merci pour le code parce que ça m'a fait voir que le parent ne fait pas ce que je pensais qu'il allait faire – comfortablyNumb
@comfortablyNumb De rien. Pourriez-vous réessayer s'il vous plaît? Il y avait 1 petite erreur de syntaxe, que j'ai fixée (parenthèse manquante)) – user2771704
Il cache le mauvais cadre. Il cache le cadre supérieur que le menu est parfaitement dans. Ce dont j'ai besoin, c'est de cacher le cadre du bas. Une idée de comment je peux accéder à ce cadre? document.getElementById ('bottomFrame'). style.visibility = "hidden" ne fonctionne pas. J'ai essayé de remplacer votre .parent() par $ (this) .document.getElementById ('bottomFrame'). Css ("visibility", "hidden"); mais il ne reconnaît pas getElementById ('bottomFrame') – comfortablyNumb