Author: | Ignas2526 |
---|---|
Views Total: | 205 views |
Official Page: | Go to website |
Last Update: | March 4, 2019 |
License: | MIT |
Preview:

Description:
iWin is a vanilla JavaScript library to create dynamic, draggable, resizable, floating windows on the page.
How to use it:
Import the iWin library into the document.
<script src="iWin.js"></script>
Define a unique ID for the window.
var wID = 'iDemo' + new Date().getTime();
Initialize the iWin.
iWin.init({ onSetTitle:function(wID, obj, title) { obj.innerHTML = '<span>[X]</span><span>'+ title+ '</span>'; // Capture phase second iWin.addEvent(iWin.win[wID].obj.children[0].children[0], 'press', function(e) { var evt = e || window.event; evt.preventDefault(); iWin.win[wID].onClose(wID, e); (e.stopPropagation)? e.stopPropagation(): e.cancelBubble = true; }, true); } });
Call the iWin.create
function to create the window. The first argument is an object containing parameters which can be changed later by calling various methods.
iWin.create({ title: 'Window Title', onClose:function(){iWin.destroy(wID)}}, wID );
Set contents of the window. The second argument indicates that we want window to be automatically resized to fit the content.
iWin.setContent('Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br>'+ 'Nulla varius justo tellus, ac aliquam lorem maximus ut. Suspendisse fermentum<br>'+ 'purus euismod quam consequat interdum. Maecenas eget ultrices ligula, sed fringilla<br>'+ 'nisl. Ut eu leo non sem ultricies interdum. Nam et porta metus, sed efficitur felis.<br>'+ 'Proin et mauris magna. Fusce et condimentum dui, id finibus lorem. Nunc volutpat, neque<br>'+ 'nec tincidunt auctor, risus dui congue felis, vel tristique ipsum sapien sed lorem.<br>'+ 'Maecenas tempor vestibulum nunc vel maximus. Nulla varius finibus velit, in aliquet<br>'+ 'felis dignissim in. Pellentesque ut commodo metus. Sed suscipit erat non mauris finibus<br>'+ 'pretium. Phasellus dignissim sem turpis, id suscipit magna suscipit ut. ', wID); iWin.setContentDimensions(null, wID); iWin.setPosition(60, (window.innerWidth / 2) - 20, wID);
Show the window on the page.
iWin.show(wID);