Hi Experts,
I am working on Studio Edition Version 12.2.1.2.0.
In my application, i am using below task flow for top and 2nd level menus to render on the page. Everything works fine, but on tab out the next menu is not highlighting or not able to see focused or not. Some how skinning is making that focus is hide. I tried below code to make the focus highlight but none of them were worked. Can any one help how to make the menu's focus visible on the page.
af|commandMenuItem::bar-item-text:focus {
background-color: #80a7ff;
outline:#bbff91 solid medium;
}
and
af|commandMenuItem:focus {
background-color: #80a7ff;
outline:#bbff91 solid medium;
}
<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:af="http://xmlns.oracle.com/adf/faces/rich" xmlns:f="http://java.sun.com/jsf/core">
<af:panelStretchLayout id="mainTopStretchPanel" styleClass="TopNavTopStretchPanel" bottomHeight="0px" dimensionsFrom="auto" binding="#{backingBeanScope.o_w_wa_scopeLevelTabs}">
<f:facet name="center">
<af:menuBar id="mb1" styleClass="WCPortalTopNavMenu TopNavMenuBar">
<af:iterator id="i1" var="item" value="#{boilerBean.navigationModelPath == null ? navigationContext.defaultNavigationModel.listModel['startNode='.concat(pageFlowScope.StartNodeInput).concat(', includeStartNode=false')] : navigationContext.navigationModel[modelPath=boilerBean.navigationModelPath].listModel['startNode='.concat(pageFlowScope.StartNodeInput).concat(', includeStartNode=false')]}" rows="0">
<af:switcher id="s1" facetName="#{item.separator ? 'separatorFacet' : (item.attributes['hasChild'] == 'true' or item.navigable) ? 'menuItemFacet' : 'null'}">
<f:facet name="menuItemFacet">
<af:switcher id="s3" facetName="#{(item.attributes['hasChild'] == 'true' and pageFlowScope.ShowChildren) ? 'navigationMenuFacet' : 'navigationItemFacet'}">
<f:facet name="navigationItemFacet">
<af:switcher id="s6" facetName="#{(empty item.attributes['Target'] || item.attributes['Target'] == '_popup') ? 'command' : 'golink'}">
<f:facet name="command">
<af:switcher id="s8" facetName="#{item.attributes['Target'] == '_popup' ? 'client' : 'server'}">
<f:facet name="server">
<af:commandMenuItem accessKey="#{item.attributes['AccessKey']}" id="dc_menuitem2" text="#{WCTruncator[item.title]['25']}" shortDesc="#{item.attributes['ToolTip']}" styleClass="#{item.onSelectedPath ? 'NavSelected' : ''} NavItem" actionListener="#{navigationContext.processAction}" action="pprnav" partialSubmit="false">
<f:attribute name="node" value="#{item}"/>
</af:commandMenuItem>
</f:facet>
<f:facet name="client">
<af:commandMenuItem id="dc_menuitem2_client" text="#{WCTruncator[item.title]['25']}" shortDesc="#{item.attributes['ToolTip']}" styleClass="#{item.onSelectedPath ? 'NavSelected' : ''}" actionListener="#{navigationContext.processAction}" action="pprnav" partialSubmit="false" clientComponent="true">
<f:attribute name="node" value="#{item}"/>
<af:clientAttribute name="modelPath" value="#{item.navigationModel.metadataId}"/>
<af:clientAttribute name="selectedPrettyUrl" value="#{item.prettyUrl}"/>
<af:clientAttribute name="selectedTitle" value="#{item.title}"/>
<af:showPopupBehavior popupId="::rendererPopup" triggerType="mouseHover"/>
</af:commandMenuItem>
</f:facet>
</af:switcher>
</f:facet>
<f:facet name="golink">
<af:goMenuItem id="gmi1" text="#{WCTruncator[item.title]['25']}" shortDesc="#{item.attributes['ToolTip']}" targetFrame="#{item.attributes['Target']}" destination="#{item.goLinkPrettyUrl}" styleClass="#{item.onSelectedPath ? 'NavSelected' : ''}"/>
</f:facet>
</af:switcher>
</f:facet>
<f:facet name="navigationMenuFacet">
<af:commandMenuItem accessKey="#{item.attributes['AccessKey']}" text="#{WCTruncator[item.title]['25']}" id="dc_menu2_" actionListener="#{navigationContext.processAction}" action="pprnav" partialSubmit="false" styleClass="WCPortalTopNavMenu NavItem #{item.onSelectedPath ? 'NavSelected' : ''}">
<af:showPopupBehavior popupId="menuPopup" triggerType="mouseHover" align="afterStart"/>
<f:attribute name="node" value="#{item.children[0]}"/>
</af:commandMenuItem>
<af:popup childCreation="deferred" autoCancel="disabled" id="menuPopup" contentDelivery="immediate">
<af:iterator id="i2" var="subitem" value="#{item.children}" rows="0">
<af:switcher id="s4" facetName="#{!subitem.separator and subitem.navigable ? 'navMenuChildFacet' : 'null'}">
<f:facet name="navMenuChildFacet">
<af:switcher id="s7" facetName="#{(empty subitem.attributes['Target'] || subitem.attributes['Target'] == '_popup') ? 'command2' : 'golink2'}">
<f:facet name="command2">
<af:switcher id="s9" facetName="#{subitem.attributes['Target'] == '_popup' ? 'client' : 'server'}">
<f:facet name="server">
<af:commandMenuItem id="dc_cmi2" text="#{subitem.title}" shortDesc="#{subitem.attributes['ToolTip']}" icon="#{not empty subitem.attributes['IconURI'] ? subitem.attributes['IconURI'] : not empty item.attributes['IconURI'] ? item.attributes['IconURI'] : '/adf/webcenter/pages_qualifier.png'}" actionListener="#{navigationContext.processAction}" action="pprnav" partialSubmit="false">
<f:attribute name="node" value="#{subitem}"/>
</af:commandMenuItem>
</f:facet>
<f:facet name="client">
<af:commandMenuItem id="dc_cmi2_client" text="#{subitem.title}" shortDesc="#{subitem.attributes['ToolTip']}" icon="#{not empty subitem.attributes['IconURI'] ? subitem.attributes['IconURI'] : not empty item.attributes['IconURI'] ? item.attributes['IconURI'] : '/adf/webcenter/pages_qualifier.png'}" actionListener="#{navigationContext.processAction}" action="pprnav" partialSubmit="false" clientComponent="true">
<f:attribute name="node" value="#{subitem}"/>
<af:clientAttribute name="modelPath" value="#{subitem.navigationModel.metadataId}"/>
<af:clientAttribute name="selectedPrettyUrl" value="#{subitem.prettyUrl}"/>
<af:clientAttribute name="selectedTitle" value="#{subitem.title}"/>
<af:showPopupBehavior popupId=":::rendererPopup" triggerType="mouseHover"/>
</af:commandMenuItem>
</f:facet>
</af:switcher>
</f:facet>
<f:facet name="golink2">
<af:goMenuItem id="gmi2" text="#{WCTruncator[subitem.title]['25']}" shortDesc="#{subitem.attributes['ToolTip']}" icon="#{not empty subitem.attributes['IconURI'] ? subitem.attributes['IconURI'] : not empty item.attributes['IconURI'] ? item.attributes['IconURI'] : '/adf/webcenter/pages_qualifier.png'}" targetFrame="#{subitem.attributes['Target']}" destination="#{subitem.goLinkPrettyUrl}"/>
</f:facet>
</af:switcher>
</f:facet>
</af:switcher>
</af:iterator>
</af:popup>
</f:facet>
</af:switcher>
</f:facet>
</af:switcher>
</af:iterator>
</af:menuBar>
</f:facet>
<f:facet name="bottom">
<af:popup id="rendererPopup" contentDelivery="lazyUncached" launcherVar="source" eventContext="launcher">
<af:setPropertyListener from="#{source.attributes.modelPath}" to="#{viewScope.modelPath}" type="popupFetch"/>
<af:setPropertyListener from="#{source.attributes.selectedPrettyUrl}" to="#{viewScope.selectedPrettyUrl}" type="popupFetch"/>
<af:setPropertyListener from="#{source.attributes.selectedTitle}" to="#{viewScope.selectedTitle}" type="popupFetch"/>
<af:setPropertyListener from="#{'true'}" to="#{viewScope.loadRendererPopup}" type="popupFetch"/>
<af:dialog id="pt_d1" title="#{viewScope.selectedTitle}" type="none" stretchChildren="first" contentWidth="640" contentHeight="480">
<af:region value="#{bindings.navigationrenderer1.regionModel}" id="pt_r1"/>
</af:dialog>
</af:popup>
</f:facet>
</af:panelStretchLayout>
</jsp:root>