layx--the best choice for pop-up pages.

Open Source Document Address

Open Source Address: Https://gitee.com/monksoul/LayX

Document Address: http://baisoft.gotoip11.com/layx/doc/

Objective

Hello everyone, my name is hundred small Monk, is a C # development engineer, but also good at a variety of programming languages. The usual work is to develop enterprise management system (ERP, CRM). At present, the enterprise management system is more C/s architecture, and the C/S Architecture multi-window processing data more flexible. Just the company in order to comply with the trend of the existing enterprise management system with a new B/s structure of new development, our original idea is to use similar browser multi-tabbed mode design in the B/S structural interface, but to the customer trial most of the veto, these customers agree that the client Multi-window operation mode is better. So it has to be developed according to the traditional C/S model.

However, the current Web page pop-up layer plug-in does not meet our expectations or not achieve the C/S Architecture Multi-window should be the level. Therefore, I use 51 during the holiday to personally fencing.

Two days later, Layx was born ...

Why is it called Layx? In fact, it is very simple, the layer of English is layers, but there is already a very mature layer plug-in, then I have to play a good name: layerx--is more than the layer of the x meaning * ^ *. Finally pondering the discovery of the name is still a bit long, but also a bit of heat bright, so simply remove the ER, directly called Layx.

function Introduction

Layx is a native JavaScript-written web popup plugin that completely mimics the Windows 10 operating system window for design and development.

Currently LAYX has the following functions

• Supports Text window, page window (IFRAME)
• Supports maximized, minimized, restored, closed, and pinned features
• Support window dragging and four-direction drag control
• Support 8-direction window drag change size (top, right, bottom, left, top left, left, right, bottom right)
• Window minimum width, maximum width control
• Window Focus Activation Control
• Support for Window Shadow control
• window automatically records last location
• Support double-click title Toggle Window
• Support drag window to top auto maximize, maximize drag auto restore normal window
• Supports MDI multilevel nested windows
• Support for Window appearance control (background color, transparency, border color, status bar, etc.)
• Support window icon Customization, action button customization
• Support Windows communicate with each other
• Support window operation monitoring (minimum monitoring, maximum monitoring, resume monitoring, top listening, drag monitoring, change size monitoring, load monitoring, etc.)
• Support window open initialize position control (middle, top left, top right, bottom left, bottom right, custom top and left)
• Supports window blocking, masking
• Support Auto Get IFRAME page title fill window title
• Support window status Interceptor, can intercept all operation function of window
• Support window loading prompt control
• Compatible with ie9+, Chrome, Edge, FF, opera and other modern mainstream browsers

The future features much more than that ...

Configuration parameters

Layx default configuration parameter var defaults = {id: ' Layx ',//Unique ID icon: ',//icon, set false not enabled, here support HTML code title: ' ',//Window caption bgColor: ' #fff ',//Background color, IFRAME page background is transparent effective bordercolor: ' #3baced ',//Border color opacity:1,//Transparent        Degree type: ' iframe ',//window type: Support iframe,alert,confirm,error,load,prompt URL: ',//IFRAME type address, type=iframe valid  Content: ',//non-IFRAME type contents, support text,html width:800,//Initialize width height:600,//Initialize height Loaddingtext:        ' Content loading ... ',//content loaded in this content, support for HTML position: ' Center ',//Initialize location, support ' center ', ' LT ', ' RT ', ' lb ', ' RB ' and [Top,left] Array        Useframetitle:false,//Whether auto get IFrame page title fill window title minwidth:150,//Drag size min width minheight:150,//drag size max width Shadable:false,//whether to enable the window barrier Alwaysontop:false,//Whether always pinned Pinable:false,//whether to display the Pushpin button, when alwaysontop for TR UE, Pinable automatically display minimizable:true,//whether to allow the minimization of maximizable:true,//whether to allow maximum closable:true,//whether to allow Close Resizable:truE,//whether to allow drag size//Drag direction control Resizelimit: {t:true,//whether to allow drag size above, true allow r:true,//whether to allow Right drag size, true allow b:true,//whether to allow drag size below, true allow l:true,//whether to allow the left drag size, true allow lt:true,//whether  Allow left top drag size, true allow rt:true,//whether to allow the right top drag size, true allow lb:true,//whether to allow the left bottom drag size, True allows rb:true Allow right bottom drag size, true allow}, movable:true,//Whether to allow drag window//Drag window display, vertical to true to prohibit horizontal drag, horizontal to True table Show prohibit vertical drag Movelimit: {vertical:false,//whether to prohibit vertical drag, false does not prohibit horizontal:false,//whether to prohibit horizontal drag, FAL SE does not prohibit leftout:true,//whether to allow the left to drag out, true to allow rightout:true,//whether to allow the right to drag out, True allows Topout:true, Whether to allow drag-out above, true allows, this setting whether false or true, the window can not be dragged out of the form bottomout:true,//whether to allow the bottom drag out, true allow}, StatusBar:        False,//whether to display the status bar focusable:true,//whether to enable the IFRAME page click on the top//scaleanimatable:false,//whether to enable the window scaling animation, development .... AllowtitledblclicktorEstore:true,//Whether to allow the title double-click the Recover Form//parent:null,//parent form ID, when setting this option, the form will open in the form's internal page (MDI mode) and share the same life cycle with the parent window; Note: Only non-cross-domain pages are supported. Development ...//MenuItems: [],//Custom top dropdown menu, support infinite Pole, developing ....//Interceptor, can listen to the various states of the window intercept: {//IFRA Me page load Monitor load: {//before loading, return false; disable loading before:function (windowdom, WinForm) {            },//After loading after:function (Windowdom, WinForm, iframe) {}},//Minimize monitoring                Min: {//minimize before, return false; prohibit minimize before:function (Windowdom, WinForm) {},  After minimizing after:function (Windowdom, WinForm) {}},//Maximize listening Max: {//maximize before return false; disable maximize before:function (Windowdom, WinForm) {},//MAX                After:function (Windowdom, WinForm) {}},//Resume listening for restore: { return false before resuming, disableComplex Before:function (Windowdom, WinForm) {},//After recovery after:function (Windowdom,                WinForm) {}},//Turn off Listen destroy: {//close before return false; Disable shutdown            Before:function (Windowdom, WinForm) {},//closed after after:function (Windowdom, WinForm) {} },///Top Monitor PIN: {//front, return false; Disable Operation Before:function (            Windowdom, WinForm) {},//After:function (Windowdom, WinForm) {}} after being pinned,                Move Window Monitor Move: {//move before Before:function (Windowdom, WinForm) {}, Move in Moveing:function (Windowdom, WinForm) {},//Move End After:function (Windowdom, WinForm) {}},//Drag window Size Listener resize: {//move before before:function (window Dom, WinForm) {},//Move in Resizing:function (Windowdom, WinForm) {},//Move End After:function (Windowdom, WinForm) {}}};

　　

layx--the best choice for pop-up pages.