Lightweigt Popup Window Plugin - jquery-wm

File Size: 9.93KB
Views Total: 1470
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Lightweigt Popup Window Plugin - jquery-wm

jquery-wm is a simple and lightweight jQuery plugin that allows you to create popup child windows in your web browser.

Basic Usage:

1. Include jQuery library and jquery-wm.js in your header

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery-wm/main.js"></script>

2. Markup

<button type=button onclick="var w = $().WM('open'); w.find('.windowcontent').html('some html content here');">Demo</button>

3. Stylize with CSS

  .window {
    background-color: purple;
    border-width: 4px;
    border-color: yellow;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
    filter: alpha(opacity=20);
    opacity: .2;
  }
  .windowtitlebar {
    background-color: black;
    color: green;
  }
  .window.focused {
    background-color: purple;
    border-width: 8px;
    border-color: green;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90);
    opacity: .9;
  }
  .window.focused .windowtitlebar {
    background-color: orange;
    color: red;
    text-decoration: blink;
  }
  .window.focused .windowcontent {
    background-color: white;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
  }
  .window .horizbuts * {
    background-color: yellow;
  }

This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.