JS compatible PC-side browser and have a variety of pop-up tips for mobile phone-side floating layer control instance _javascript tips

This article describes the JS compatible PC-side browser and has a variety of pop-up tips for mobile phone-side floating-layer control. Share to everyone for your reference. Specifically as follows:

Full instance code click here to download the site.

Usage

<input type= "button" id= "Btn_dialog" value= "open floating layer"/> <div id= "dialog-content" style= "Display:none"
. > This is content </div>
<script src= ". /src/jquery-1.9.1.min.js "></script>
<script src=". /src/dialog.js "></script>
<script>
 var Dialog = New dialog ();
 Dialog.init ({target: "#dialog-content", Trigger: "#btn_dialog", Mask:true,width:500,height:300,title: ' title '});
</script>

or call it in jquery:

<input type= "button" id= "Btn_dialogjquery value=" JQ open floating layer/> <div id= "DIALOG-CONTENTJQ"
display: none; " > This is the content 22</div>
<script src= ". /src/dialog-jquery.js "></script>
<script>
 $ (' #btn_dialogjquery '). Dialog ({target: "#dialog-contentjq", Mask:true,width:500,height:300,title: ' title '})
</script>

Inheriting class alert and confirm hints (in jquery mode):

Html:

<input type= "button" id= "Btn_alert" value= "alert"/> <input type=
"button" id= "Btn_alert2" value= " Alert timed off "/>
<input type=" button "id=" Btn_confirm "value=" confirm three kinds of buttons "/> <input
" button " Id= "Btn_confirmdefault" value= "confirm Default"/>

Js:

$ (' #btn_alert '). Click (function () {
  $.alert (' Select a good item to upload material Oh ', true,function () {
   alert (' You clicked OK ')}
}) ;
$ (' #btn_alert2 '). Click (function () {
  $.alert (' Choose a good product to upload material oh ')
});
$ (' #btn_confirm '). Click (The function () {
  $.confirm (' Download all 9 pictures to the local album? <div class= ' confirm-title2 ' > Text content replicated </ Div> ', [{yes: ' is '},{no: ' No '},{close: ' Close '}],function (type) {
   $.alert (' You clicked ' +type ');
   This.hide ();
  })
$ (' #btn_confirmdefault '). Click (function () {
  $.confirm (') are you sure you want to delete this message? ', null,function (type) {
   $.alert (' You clicked on ' +type ');
   This.hide ();
  })

Property or method:

Property:

Trigger
Trigger Object

Target
Pop-up content, can be #id, or jquery object

Mask
Is there a mask layer

Title
Title

ZIndex:
Z-index

CLOSETPL:
Turn off HTML (default: <span class= "Ui-dialog-close js-dialog-close" >x</span>)

TITLETPL:
Title HTML (default: <div class= "Ui-dialog-title" ></div>)

method and callback:

Show
Show projectile layer

Hide
Hide

Beforeshow:function (content)
The method callback before the display, content is the floating Layer contents object

Beforehide:function (content)
Pre-hidden method callback, content is a floating layer contents object

Setposition:function ()
Set Position Center

I hope this article will help you with your JavaScript programming.