These days, I am working on HTML5 project. In the project, I need to popup a window with black background mask. When I click on the mask, the popup window will dismiss. This effect is quite simple but it may take time when we want to implement it again. So I put this HTML popup widget here. You can download this HTML5 widget for free.

Demo: Click Button to Popup Window with Black Background

In this demo, I will put an anchor link. When clicking on the link, a text field will popup. When clicking on the black background, the text field will dismiss.

<a onclick="popup()">Open</a>

Import the following javascript in the html:

	<script src="simplePopup.js"></script>
	<script>
		var myDiv = null;
		function popup() {
			var popupEng = new simplePopup();
			if(myDiv == null) {
				myDiv = document.createElement("div");
				myDiv.style.zIndex = "3";
				myDiv.style.position = "absolute";
				myDiv.innerHTML = "Click Black Background to Dismiss!";
				myDiv.style.backgroundColor = "#FFFFFF";
				myDiv.style.paddingTop = "5px";
				myDiv.style.paddingBottom = "5px";
				myDiv.style.paddingLeft = "5px";
				myDiv.style.paddingRight = "5px";
			}
			
            myDiv.style.display = "block";
			popupEng.popup(myDiv);
		}
	</script>

Try the demo: Click to open

Download HTML5 Popup Window Widget for Free

You can download this JS library for free.

Download JS Library

Google chart is a powerful graphic chart library to build HTML or SVG chart dynamically. Several days ago, I got a project to build a 4 dimension chart with Google Chart. The project requires to build a combo dual-Y axis chart with 2 stacked columns and 1 line. In Google char help page, there are some example to explain how to build stacked column chart, line chart, dual-Y axis chart, or combo chart. But there is no example to show you how to build such complicated chart which has dual-Y axis, stacked columns and line at the same time. After several hours research and test, I successfully got it working with Google Chart library. I guess it could be very helpful if I post the source code here.
Read more