button aria-popup with Dashboard container/header

Hi Team

I need some help around below logic, i have a header(Dashboard). I want this header be filled with my button aria-popup but this must show little at the end not be filled/expanded. here is my attempt

<center>
<div class="ic-Dashboard-header_layout">
<h1 class="ic-Dashboard-header_title">
<span class="hidden-phone">Dashboardspan>
h1>
<div class="menu_button">
<a id="menubutton" role="button" href="#" aria-haspopup="true" aria-expanded="false" aria-controls="menu2">a>
<ul id="meu2" role="menu" arial-labelledby="menubutton">
<li role="none">
<a role="menuitem" href="https://www.w3.org/">Dashboard Viewa>
li>
<li role="none">
<a role="menuitem" href="https://www.w3.org/TR/wai-aria-implementation/">Card Viewa>
li>
<li role="none">
<a role="menuitem" href="https://www.w3.org/TR/accname-aam-1.1">Recent Activitya>
li>
ul>
<script type="text/javascript">
window.onload = function () { var menubutton = new MenuButton(document.getElementById('menubutton')); menubutton.init(); }
script>
div>
div>
<section class="content-header-fluid">
section>
center>
<script src="w3.org/TR/2016/WD-wai-aria-practises-1.1-20161224/examples/menu-button-2/js/PopupMenuLinks.js">script>
<script type="text/javascript">script>

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Guest User6y ago
Hi Naveneeth

The only way that this navbar to work is to have that script below my HTML? Yes add header tag in menu button popup. In another words that header must have that menu button at the end of the header, when a user clicks it must popup.
Navaneeth Krishnan6y ago
my understanding from your question is you are trying to add header tag in the menu button pop up right.

$('#meu2').append($('.ic-Dashboard-header_layout').html())

you can add style or css dynamically to make smaller.