Jsf 单击图像时显示菜单

我想以编程方式创建primefaces菜单组件，下面是xhtml标记：

<p:menu model="#{notificationMenu.model}" />

下面是相关的弹簧组件：

@Component
@Scope("session")
@Qualifier("notificationMenu")
public class NotificationMenu {

    @Autowired
    NotificationService notificationService;

    private MenuModel model;

    @PostConstruct
    public void createMenuModel() {

        List<Notification> listNotifs = notificationService.getAllUnreadNotifsForUser(LoginBean.getConnectedUser());

        model = new DefaultMenuModel();

        DefaultSubMenu subMenu = new DefaultSubMenu();

        for (Notification notification : listNotifs) {

            DefaultMenuItem item = new DefaultMenuItem();
            item.setValue(notification.getTypenotification().getTypenotif());
            item.setUrl("/user/index.xhtml");

            subMenu.addElement(item);
        }

        model.addElement(subMenu);
    }

    public MenuModel getModel() {
        return model;
    }
}

@组件
@范围（“会议”）
@限定符（“通知菜单”）
公共类通知菜单{
@自动连线
通知服务通知服务；
私有菜单模型；
@施工后
public void createMenuModel（）{
List listNotifs=notificationService.getAllUnreadNotifsForUser（LoginBean.getConnectedUser（））；
模型=新的DefaultMenuModel（）；
DefaultSubMenu子菜单=新建DefaultSubMenu（）；
用于（通知：listNotifs）{
DefaultMenuItem=新的DefaultMenuItem（）；
item.setValue（notification.getTypenotification（）.getTypenotif（））；
item.setUrl（“/user/index.xhtml”）；
子菜单.附录（项目）；
}
model.addElement（子菜单）；
}
公共菜单模型getModel（）{
收益模型；
}
}

我希望通过编程将此菜单与图形图像（如通知图像）关联，以便当用户单击图像时，显示菜单。。。可能吗

---

编辑：

---

我希望菜单显示在图像下方，并在模糊时消失（单击图像外部）。

覆盖菜单

通过将

overlay

选项设置为

true

并定义一个触发器来显示动态菜单 菜单。页面上菜单的位置将与触发器相关，并由

my

和

at

选项定义 取四个值的组合：

• 左
• 对
• 底部
• 顶

也就是说：

<p:menu overlay="true" trigger="img"
        my="left top"
        at="bottom left"
        model="#{notificationMenu.model}" />
<p:graphicImage id="img" />