Notification notifys users an info, warning or error in a pop-up dialog.

A simple notification is displayed in the middle of the screen, and fade out when the user clicks.
A closable notification fades out when the user clicks the close button.
A custom notification can have a specific position, or be anchored on another component. It can also receive a different icon, or set a custom fade out delay.

<zk>
	<hlayout apply="demo.popup.notification.NotificationComposer"
		vflex="min">
		<vlayout>
			<div style="padding-top:15px;padding-bottom:15px;">
				<button label="Simple notification" id="notifBtn" />
			</div>
			<div style="padding-top:15px;padding-bottom:15px;">
				<button label="Closable notification"
					id="notifCloseBtn" />
			</div>
			<vlayout style="padding-top: 15px;">
				<hlayout>
					<label value="Notification type: " />
					<radiogroup id="rgType">
						<radio label="info" selected="true" />
						<radio label="warning" />
						<radio label="error" />
					</radiogroup>
				</hlayout>
				<button label="Notification icon and target" id="notifTargetBtn" />
			</vlayout>
		</vlayout>
	</hlayout>
</zk>

package demo.popup.notification;

import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Listen;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zk.ui.util.Clients;
import org.zkoss.zk.ui.util.Notification;
import org.zkoss.zul.Button;
import org.zkoss.zul.Radiogroup;

public class NotificationComposer extends SelectorComposer<Component> {

	@Wire
	private Radiogroup rgType;
	@Wire
	private Button notifTargetBtn;

	@Override
	public void doAfterCompose(Component comp) throws Exception {
		super.doAfterCompose(comp);
	}

	@Listen("onClick = #notifBtn")
	public void notifyBtnClick() {
		Notification.show("You have been notified");
	}

	@Listen("onClick = #notifCloseBtn")
	public void notifyCloseBtnClick() {
		Notification.show("You have been notified", true);
	}

	@Listen("onClick = #notifTargetBtn")
	public void notifyCustomBtnClick() {
		Notification.show("You have been notified", rgType.getSelectedItem().getLabel(),
				notifTargetBtn, "after_start", 2000, false);
	}

}