添加图片拖动验证

hdw

2018-11-26 75f8d8615b1d994b9a49db7ec154abb8466bb690

添加图片拖动验证

 gx_tieta/WebRoot/css/login_layout.css

@@ -227,4 +227,53 @@
.container .bg-img img {

    width: 100%;

    height: 100%;

}



.hdw-dialog {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: none;

    z-index: 9999;

}



.hdw-dialog.hdw-dialog-hide {

    display: none;

}



.hdw-dialog .hdw-dialog-container {

    position: relative;

    width: 100%;

    height: 100%;

    background-color: none;

}



.hdw-dialog-bg {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: #000000;

    opacity: .1;

    z-index: 0;

}

.hdw-dialog-content {

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background-color: #FFFFFF;

    z-index: 1;

}

.hdw-dialog-content.hdw-dialog-width500-300 {

    width: 500px;

    height: 300px;

    left: 50%;

    margin-left: -250px;

    top: 50%;

    margin-top: -150px;

}

 gx_tieta/WebRoot/images/1.jpg

 gx_tieta/WebRoot/images/2.jpg

 gx_tieta/WebRoot/js/verify/css/htmleaf-demo.css

New file
@@ -0,0 +1,253 @@
@font-face {

    font-family: 'icomoon';

    src:url('../fonts/icomoon.eot?rretjt');

    src:url('../fonts/icomoon.eot?#iefixrretjt') format('embedded-opentype'),

        url('../fonts/icomoon.woff?rretjt') format('woff'),

        url('../fonts/icomoon.ttf?rretjt') format('truetype'),

        url('../fonts/icomoon.svg?rretjt#icomoon') format('svg');

    font-weight: normal;

    font-style: normal;

}



[class^="icon-"], [class*=" icon-"] {

    font-family: 'icomoon';

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;



    /* Better Font Rendering =========== */

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



body, html { font-size: 100%;     padding: 0; margin: 0;}



/* Reset */

*,

*:after,

*:before {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}



/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */

.clearfix:before,

.clearfix:after {

    content: " ";

    display: table;

}



.clearfix:after {

    clear: both;

}



body{

    font-weight: 500;

    font-size: 1.05em;

    font-family: "Microsoft YaHei","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif;

}

.htmleaf-links a{ color: rgba(255, 255, 255, 0.6);outline: none;text-decoration: none;-webkit-transition: 0.2s;transition: 0.2s;}

.htmleaf-links a:hover,.htmleaf-links a:focus{color:#74777b;text-decoration: none;}

.htmleaf-container{

    margin: 0 auto;

}



.bgcolor-1 { background: #f0efee; }

.bgcolor-2 { background: #f9f9f9; }

.bgcolor-3 { background: #e8e8e8; }/*light grey*/

.bgcolor-4 { background: #2f3238; color: #fff; }/*Dark grey*/

.bgcolor-5 { background: #df6659; color: #521e18; }/*pink1*/

.bgcolor-6 { background: #2fa8ec; }/*sky blue*/

.bgcolor-7 { background: #d0d6d6; }/*White tea*/

.bgcolor-8 { background: #3d4444; color: #fff; }/*Dark grey2*/

.bgcolor-9 { background: #ef3f52; color: #fff;}/*pink2*/

.bgcolor-10{ background: #64448f; color: #fff;}/*Violet*/

.bgcolor-11{ background: #3755ad; color: #fff;}/*dark blue*/

.bgcolor-12{ background: #3498DB; color: #fff;}/*light blue*/

.bgcolor-20{ background: #494A5F;color: #D5D6E2;}

/* Header */

.htmleaf-header{

    padding: 1em 190px 1em;

    letter-spacing: -1px;

    text-align: center;

    background: #66677c;

}

.htmleaf-header h1 {

    color: #D5D6E2;

    font-weight: 600;

    font-size: 2em;

    line-height: 1;

    margin-bottom: 0;

}

.htmleaf-header h1 span {

    display: block;

    font-size: 60%;

    font-weight: 400;

    padding: 0.8em 0 0.5em 0;

    color: #c3c8cd;

}

/*nav*/

.htmleaf-demo a{color: #fff;text-decoration: none;}

.htmleaf-demo{width: 100%;padding-bottom: 1.2em;}

.htmleaf-demo a{display: inline-block;margin: 0.5em;padding: 0.6em 1em;border: 3px solid #fff;font-weight: 700;}

.htmleaf-demo a:hover{opacity: 0.6;}

.htmleaf-demo a.current{background:#1d7db1;color: #fff; }

/* Top Navigation Style */

.htmleaf-links {

    position: relative;

    display: inline-block;

    white-space: nowrap;

    font-size: 1.5em;

    text-align: center;

}



.htmleaf-links::after {

    position: absolute;

    top: 0;

    left: 50%;

    margin-left: -1px;

    width: 2px;

    height: 100%;

    background: #dbdbdb;

    content: '';

    -webkit-transform: rotate3d(0,0,1,22.5deg);

    transform: rotate3d(0,0,1,22.5deg);

}



.htmleaf-icon {

    display: inline-block;

    margin: 0.5em;

    padding: 0em 0;

    width: 1.5em;

    text-decoration: none;

}



.htmleaf-icon span {

    display: none;

}



.htmleaf-icon:before {

    margin: 0 5px;

    text-transform: none;

    font-weight: normal;

    font-style: normal;

    font-variant: normal;

    font-family: 'icomoon';

    line-height: 1;

    speak: none;

    -webkit-font-smoothing: antialiased;

}

/* footer */

.htmleaf-footer{width: 100%;padding-top: 10px;}

.htmleaf-small{font-size: 0.8em;}

.center{text-align: center;}

/****/

.related {

    color: #fff;

    background: #494A5F;

    text-align: center;

    font-size: 1.25em;

    padding: 0.5em 0;

    overflow: hidden;

}



.related > a {

    vertical-align: top;

    width: calc(100% - 20px);

    max-width: 340px;

    display: inline-block;

    text-align: center;

    margin: 20px 10px;

    padding: 25px;

    font-family: "Microsoft YaHei","宋体","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif, FreeSans, Arimo;

}

.related a {

    display: inline-block;

    text-align: left;

    margin: 20px auto;

    padding: 10px 20px;

    opacity: 0.8;

    -webkit-transition: opacity 0.3s;

    transition: opacity 0.3s;

    -webkit-backface-visibility: hidden;

    text-decoration: none;

}



.related a:hover,

.related a:active {

    opacity: 1;

}



.related a img {

    max-width: 100%;

    opacity: 0.8;

    border-radius: 4px;

}

.related a:hover img,

.related a:active img {

    opacity: 1;

}

.related h3{font-family: "Microsoft YaHei", sans-serif;font-size: 1.2em}

.related a h3 {

    font-size: 0.85em;

    font-weight: 300;

    margin-top: 0.15em;

    color: #fff;

}

/* icomoon */

.icon-htmleaf-home-outline:before {

    content: "\e5000";

}



.icon-htmleaf-arrow-forward-outline:before {

    content: "\e5001";

}



@media screen and (max-width: 1024px) {

    .htmleaf-header {

        padding: 2em 10% 2em;

    }

    .htmleaf-header h1 {

        font-size:1.4em;

    }

    .htmleaf-links{font-size: 1.4em}

}



@media screen and (max-width: 960px) {

    .htmleaf-header {

        padding: 2em 10% 2em;

    }

    .htmleaf-header h1 {

        font-size:1.2em;

    }

    .htmleaf-links{font-size: 1.2em}

    .related h3{font-size: 1em;}

    .related a h3 {

        font-size: 0.8em;

    }

}



@media screen and (max-width: 766px) {

    .htmleaf-header h1 {

        font-size:1.3em;

    }

    .htmleaf-links{font-size: 1.3em}

}



@media screen and (max-width: 640px) {

    .htmleaf-header {

        padding: 2em 10% 2em;

    }

    .htmleaf-header h1 {

        font-size:1em;

    }

    .htmleaf-links{font-size: 1em}

    .related h3{font-size: 0.8em;}

    .related a h3 {

        font-size: 0.6em;

    }

}

 gx_tieta/WebRoot/js/verify/css/verify.css

New file
@@ -0,0 +1,170 @@
/*常规验证码*/
.verify-code {
    font-size: 20px;
    text-align: center;
    cursor: pointer;
    margin-bottom: 5px;
    border: 1px solid #ddd;
}

.cerify-code-panel {
    height:100%;
    overflow:hidden;
}

.verify-code-area {
    float:left;
}

.verify-input-area {
    float: left;
    width: 60%;
    padding-right: 10px;
	
}

.verify-change-area {
    line-height: 30px;
    float: left;
}

.varify-input-code {
    display:inline-block; 
    width: 100%;
    height: 25px;
}

.verify-change-code {
    color: #337AB7;
    cursor: pointer;
}

.verify-btn {
    width: 200px;
    height: 30px;
    background-color: #337AB7;
    color:#FFFFFF;
    border:none;
    margin-top: 10px;
}






/*滑动验证码*/
.verify-bar-area {
    position: relative;
    background: #FFFFFF;
       text-align: center;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
       border: 1px solid #ddd;
       -webkit-border-radius: 4px;
}
 
.verify-bar-area .verify-move-block {
    position: absolute;
    top: 0px;
    left: 0;
    background: #fff;
    cursor: pointer;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    box-shadow: 0 0 2px #888888;
    -webkit-border-radius: 1px;
}

.verify-bar-area .verify-move-block:hover {
    background-color: #337ab7;
    color: #FFFFFF;
}

.verify-bar-area .verify-left-bar {
    position: absolute;
    top: -1px;
    left: -1px;
       background: #f0fff0;
    cursor: pointer;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border: 1px solid #ddd;
}

.verify-img-panel {
    margin:0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border: 1px solid #ddd;
    border-radius: 3px;
    position: relative;
}

.verify-img-panel .verify-refresh {
    width: 25px;
    height: 25px;
    text-align:center;
    padding: 5px;
    cursor: pointer;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.verify-img-panel .icon-refresh {
    font-size: 20px;
    color: #fff;
}

.verify-img-panel .verify-gap {
    background-color: #fff;
    position: relative;
    z-index: 2;
    border:1px solid #fff;
}

.verify-bar-area .verify-move-block .verify-sub-block {
    position: absolute;
    text-align: center;
    z-index: 3;
    border: 1px solid #fff;
}

.verify-bar-area .verify-move-block .verify-icon {
    font-size: 18px;
}

.verify-bar-area .verify-msg {
    z-index : 3;
}

/*字体图标的css*/
@font-face {font-family: "iconfont";
  src: url('../fonts/iconfont.eot?t=1508229193188'); /* IE9*/
  src: url('../fonts/iconfont.eot?t=1508229193188#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAaAAAsAAAAACUwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW7kiSY21hcAAAAYAAAAB3AAABuM+qBlRnbHlmAAAB+AAAAnQAAALYnrUwT2hlYWQAAARsAAAALwAAADYPNwajaGhlYQAABJwAAAAcAAAAJAfeA4dobXR4AAAEuAAAABMAAAAYF+kAAGxvY2EAAATMAAAADgAAAA4CvAGsbWF4cAAABNwAAAAfAAAAIAEVAF1uYW1lAAAE/AAAAUUAAAJtPlT+fXBvc3QAAAZEAAAAPAAAAE3oPPXPeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sM4gYGVgYOpk+kMAwNDP4RmfM1gxMjBwMDEwMrMgBUEpLmmMDgwVDxbwtzwv4EhhrmBoQEozAiSAwAw1A0UeJzFkcENgCAMRX8RjCGO4gTe9eQcnhzAfXC2rqG/hYsT8MmD9gdS0gJIAAaykAjIBYHppCvuD8juR6zMJ67A89Zdn/f1aNPikUn8RvYo8G20CjKim6Rf6b9m34+WWd/vBr+oW8V6q3vF5qKlYrPRp4L0Ad5nGL8AeJxFUc9rE0EYnTezu8lMsrvtbrqb3TRt0rS7bdOmdI0JbWmCtiItIv5oi14qevCk9SQVLFiQgqAF8Q9QLKIHLx48FkHo3ZNnFUXwD5C2B6dO6sFhmI83w7z3fe8RnZCjb2yX5YlLhskkmScXCIFRxYBFiyjH9Rqtoqes9/g5i8WVuJyqDNTYLPwBI+cljXrkGynDhoU+nCgnjbhGY5yst+gMEq8IBIXwsjPU67CnEPm4b0su0h309Fd67da4XBhr55KSm17POk7gOE/Shq6nKdVsC7d9j+tcGPKVboc9u/0jtB/ZIA7PXTVLBef6o/paccjnwOYm3ELJetPuDrvV3gg91wlSXWY6H5qVwRzWf2TybrYYfSdqoXOwh/Qa8RWIjBTiSI3h614/vKSNRhONOrsnQi6Xf4nQFQDTmJE1NKbhI6crHEJO/+S5QPxhYJRRyvBFBP+5T9EPpEAIVzzRQIrjmJ6jY1WTo+NXTMchuBsKuS8PRZATSMl9oTA4uNLkeIA0V1UeqOoGQh7IAxGo+7T83fn3T+voqCNPPAUazUYUI7LgKSV1Jk2oUeghYGhZ+cKOe2FjVu5ZKEY2VkE13AK1+jI4r1KLbPlZfrKiPhOXKPRj7q9sj9XJ7LFHNmrKJS3VCdhXGSdKrtmoQaWeMjQVt0KD6sGPOx0oH2fgtzoNROxtNq8F3tzYM/n+TjKSX5qf2jx941276TIr9FjXxKr8eX/6bK4yuopwo9py1sw8F9kdw4AmurRpLUM3tYx5ZnKpfHPi8dzz19vJ6MjyxYUrpqeb1uLs3eGV6vr21pSqpeWkqonAN9oUyIiXpv8XvlN5e3icY2BkYGAA4n0vN4fG89t8ZeBmYQCBa9wPPRH0/wcsDMwmQC4HAxNIFABAfAqaAHicY2BkYGBu+N/AEMPCAAJAkpEBFbABAEcMAm94nGNhYGBgfsnAwMKAigESnwEBAAAAAAAAdgCkANoBCAFsAAB4nGNgZGBgYGMIZGBlAAEmIOYCQgaG/2A+AwARSAFzAHicZY9NTsMwEIVf+gekEqqoYIfkBWIBKP0Rq25YVGr3XXTfpk6bKokjx63UA3AejsAJOALcgDvwSCebNpbH37x5Y08A3OAHHo7fLfeRPVwyO3INF7gXrlN/EG6QX4SbaONVuEX9TdjHM6bCbXRheYPXuGL2hHdhDx18CNdwjU/hOvUv4Qb5W7iJO/wKt9Dx6sI+5l5XuI1HL/bHVi+cXqnlQcWhySKTOb+CmV7vkoWt0uqca1vEJlODoF9JU51pW91T7NdD5yIVWZOqCas6SYzKrdnq0AUb5/JRrxeJHoQm5Vhj/rbGAo5xBYUlDowxQhhkiMro6DtVZvSvsUPCXntWPc3ndFsU1P9zhQEC9M9cU7qy0nk6T4E9XxtSdXQrbsuelDSRXs1JErJCXta2VELqATZlV44RelzRiT8oZ0j/AAlabsgAAAB4nGNgYoAALgbsgI2RiZGZkYWRlZGNkZ2BsYI1OSM1OZs1OSe/OJW1KDM9o4S9KDWtKLU4g4EBAJ79CeQ=') format('woff'),
  url('../fonts/iconfont.ttf?t=1508229193188') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
  url('../fonts/iconfont.svg?t=1508229193188#iconfont') format('svg'); /* iOS 4.1- */
}

.iconfont {
  font-family:"iconfont" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-check:before { content: "\e645"; }

.icon-close:before { content: "\e646"; }

.icon-right:before { content: "\e6a3"; }

.icon-refresh:before { content: "\e6a4"; }

 gx_tieta/WebRoot/js/verify/fonts/icomoon.eot

Binary files differ

 gx_tieta/WebRoot/js/verify/fonts/icomoon.svg

New file
@@ -0,0 +1,12 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>Generated by IcoMoon</metadata>
<defs>
<font id="icomoon" horiz-adv-x="1024">
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" d="" horiz-adv-x="512" />
<glyph unicode="&#xe5000;" d="M949.845 492.032c-144.64 121.771-407.296 348.629-409.899 350.933l-27.947 24.021-27.819-24.021c-2.645-2.261-265.429-229.035-412.16-351.915-18.688-16.811-29.355-40.32-29.355-64.384 0-47.104 38.229-85.333 85.333-85.333h42.667v-256c0-47.104 38.229-85.333 85.333-85.333h512c47.104 0 85.333 38.229 85.333 85.333v256h42.667c47.104 0 85.333 38.229 85.333 85.333 0 25.515-11.733 49.536-31.488 65.365zM597.333 85.334h-170.667v213.333h170.667v-213.333zM768 426.667l0.085-341.333c-0.085 0-128.085 0-128.085 0v256h-256v-256h-128v341.333h-128.043c117.973 98.645 312.107 265.685 384.043 327.68 71.936-61.995 265.984-228.992 384-327.723 0 0-128 0-128 0.043z" />
<glyph unicode="&#xe5001;" d="M170.667 85.376c-4.096 0-8.149 0.64-12.203 1.792-18.091 5.376-30.464 22.016-30.464 40.875v42.667c0 204.8 144.256 378.197 341.333 417.963v72.704c0 22.784 8.875 44.203 24.96 60.331 32.256 32.299 88.533 32.256 120.704 0.043l268.288-264.661c8.149-8.021 12.715-18.901 12.715-30.379s-4.565-22.357-12.715-30.379l-268.501-264.832c-31.829-31.829-88.192-32.043-120.448 0.213-16.128 16.128-25.003 37.547-25.003 60.331v61.312c-106.453-8.576-192.981-42.027-262.997-148.651-8.107-12.288-21.547-19.328-35.669-19.328zM512 340.907c11.179 0 42.667 0.427 42.667 0.427v-149.291l237.909 234.667-237.909 234.496v-149.205c0 0-16.384 0.171-38.016-2.219-145.749-16.128-261.333-122.197-294.059-259.413 90.496 73.728 194.176 88.149 289.408 90.539z" />
</font></defs></svg>

 gx_tieta/WebRoot/js/verify/fonts/icomoon.ttf

Binary files differ

 gx_tieta/WebRoot/js/verify/fonts/icomoon.woff

Binary files differ

 gx_tieta/WebRoot/js/verify/fonts/iconfont.eot

Binary files differ

 gx_tieta/WebRoot/js/verify/fonts/iconfont.svg

New file
@@ -0,0 +1,45 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<!--
2013-9-30: Created.
-->
<svg>
<metadata>
Created by iconfont
</metadata>
<defs>

<font id="iconfont" horiz-adv-x="1024" >
  <font-face
    font-family="iconfont"
    font-weight="500"
    font-stretch="normal"
    units-per-em="1024"
    ascent="896"
    descent="-128"
  />
    <missing-glyph />
    
    <glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
    

    
    <glyph glyph-name="check" unicode="&#58949;" d="M887.904 597.792c-12.864 12.064-33.152 11.488-45.216-1.408L415.936 142.016l-233.12 229.696C170.208 384.128 149.952 384 137.536 371.392c-12.416-12.576-12.256-32.864 0.352-45.248l256.48-252.672c0.096-0.096 0.224-0.128 0.32-0.224 0.096-0.096 0.128-0.224 0.224-0.32 2.016-1.92 4.448-3.008 6.784-4.288 1.152-0.672 2.144-1.664 3.36-2.144 3.776-1.472 7.776-2.24 11.744-2.24 4.192 0 8.384 0.832 12.288 2.496 1.312 0.544 2.336 1.664 3.552 2.368 2.4 1.408 4.896 2.592 6.944 4.672 0.096 0.096 0.128 0.256 0.224 0.352 0.064 0.096 0.192 0.128 0.288 0.224l449.184 478.208C901.44 565.408 900.768 585.664 887.904 597.792z"  horiz-adv-x="1024" />

    
    <glyph glyph-name="close" unicode="&#58950;" d="M557.312 382.752l265.28 263.904c12.544 12.48 12.608 32.704 0.128 45.248-12.512 12.576-32.704 12.608-45.248 0.128l-265.344-263.936-263.04 263.84C236.64 704.416 216.384 704.48 203.84 692 191.328 679.52 191.296 659.264 203.776 646.72l262.976-263.776L201.6 119.2c-12.544-12.48-12.608-32.704-0.128-45.248 6.24-6.272 14.464-9.44 22.688-9.44 8.16 0 16.32 3.104 22.56 9.312l265.216 263.808 265.44-266.24c6.24-6.272 14.432-9.408 22.656-9.408 8.192 0 16.352 3.136 22.592 9.344 12.512 12.48 12.544 32.704 0.064 45.248L557.312 382.752z"  horiz-adv-x="1024" />

    
    <glyph glyph-name="right" unicode="&#59043;" d="M761.056 363.872c0.512 0.992 1.344 1.824 1.792 2.848 8.8 18.304 5.92 40.704-9.664 55.424L399.936 756.256c-19.264 18.208-49.632 17.344-67.872-1.888-18.208-19.264-17.376-49.632 1.888-67.872l316.96-299.84-315.712-304.288c-19.072-18.4-19.648-48.768-1.248-67.872 9.408-9.792 21.984-14.688 34.56-14.688 12 0 24 4.48 33.312 13.44l350.048 337.376c0.672 0.672 0.928 1.6 1.6 2.304 0.512 0.48 1.056 0.832 1.568 1.344C757.76 357.12 759.2 360.608 761.056 363.872z"  horiz-adv-x="1024" />

    
    <glyph glyph-name="refresh" unicode="&#59044;" d="M939.456 639.776c-16.672 5.984-34.976-2.72-40.896-19.36l-24.768-69.344c-28.992 65.312-74.784 122.72-133.088 165.92C555.328 854.272 291.296 816.768 152.32 633.344c-67.264-88.768-95.616-198.176-79.84-308.032 15.84-110.304 74.208-207.776 164.352-274.496 75.424-55.808 163.808-82.752 251.456-82.752 128.032 0 254.56 57.44 336.992 166.272 36.48 48.128 61.472 102.08 74.208 160.416 3.776 17.248-7.136 34.304-24.416 38.08-17.216 3.712-34.304-7.104-38.08-24.416-10.784-49.184-31.872-94.752-62.72-135.456-117.888-155.52-341.92-187.232-499.392-70.72-76.288 56.48-125.664 138.912-139.072 232.16-13.344 92.8 10.656 185.248 67.488 260.288 117.856 155.584 341.792 187.424 499.328 70.848 57.024-42.24 99.84-100.608 122.976-166.624l-109.984 42.944c-16.416 6.368-35.008-1.696-41.44-18.176-6.432-16.48 1.728-35.008 18.176-41.44l161.856-63.2c3.808-1.472 7.744-2.208 11.616-2.208 0.544 0 1.024 0.192 1.568 0.224 1.216-0.128 2.432-0.64 3.648-0.64 13.12 0 25.472 8.16 30.112 21.248l57.632 161.184C964.768 615.52 956.096 633.856 939.456 639.776z"  horiz-adv-x="1024" />

    


  </font>
</defs></svg>

 gx_tieta/WebRoot/js/verify/fonts/iconfont.ttf

Binary files differ

 gx_tieta/WebRoot/js/verify/fonts/iconfont.woff

Binary files differ

 gx_tieta/WebRoot/js/verify/images/1.jpg

 gx_tieta/WebRoot/js/verify/images/2.jpg

 gx_tieta/WebRoot/js/verify/js/verify.js

New file
@@ -0,0 +1,733 @@
/*! Verify-v0.1.0 MIT License by 大熊*/





;(function($, window, document,undefined) {

	
    //定义Code的构造函数

    var Code = function(ele, opt) {

        this.$element = ele,

        this.defaults = {

            type : 1,

            figure : 100,    //位数，仅在type=2时生效

            arith : 0,    //算法，支持加减乘，0为随机，仅在type=2时生效

            width : '200px',

            height : '60px',

            fontSize : '30px',

            codeLength : 6,

            btnId : 'check-btn',

            ready : function(){},

            success : function(){},

            error : function(){}

        },

        this.options = $.extend({}, this.defaults, opt)

    };

    
    var _code_chars = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];

    var _code_color1 = ['#fffff0', '#f0ffff', '#f0fff0', '#fff0f0'];

    var _code_color2 = ['#FF0033', '#006699', '#993366', '#FF9900', '#66CC66', '#FF33CC'];

    
    //定义Code的方法

    Code.prototype = {

        init : function() {

			
            var _this = this;

			
            this.loadDom();

            this.setCode();

			
            this.options.ready();

			
            this.$element[0].onselectstart = document.body.ondrag = function(){ 
                return false; 
            };

			
            //点击验证码

            this.$element.find('.verify-code, .verify-change-code').on('click', function() {

                _this.setCode();

            });

			
            //确定的点击事件

            this.htmlDoms.code_btn.on('click', function() {

                _this.checkCode();

            })

			
        },

    	
        //加载页面

        loadDom : function() {

            var panelHtml = '<div class="cerify-code-panel"><div class="verify-code"></div><div class="verify-code-area"><div class="verify-input-area"><input type="text" class="varify-input-code" /></div><div class="verify-change-area"><a class="verify-change-code">换一张</a></div></div></div>';

            this.$element.append(panelHtml);

        	
            this.htmlDoms = {

                code_btn : $('#'+this.options.btnId),

                code : this.$element.find('.verify-code'),

                code_area : this.$element.find('.verify-code-area'),

                code_input : this.$element.find('.varify-input-code'),

            };

        	
            this.htmlDoms.code.css({'width':this.options.width, 'height':this.options.height,'line-height':this.options.height, 'font-size':this.options.fontSize});

            this.htmlDoms.code_area.css({'width':this.options.width});

        },

    	
    	
        //设置验证码

        setCode : function() {

    		
            var color1Num = Math.floor(Math.random() * 3);

            var color2Num = Math.floor(Math.random() * 5);

    		
            this.htmlDoms.code.css({'background-color': _code_color1[color1Num], 'color': _code_color2[color2Num]});

            this.htmlDoms.code_input.val('');

    		
            var code = '';

            this.code_chose = '';

    		
            if(this.options.type == 1) {        //普通验证码

                for(var i = 0; i < this.options.codeLength; i++) {

                    var charNum = Math.floor(Math.random() * 52);

                    var tmpStyle = (charNum%2 ==0)? "font-style:italic;margin-right: 10px;":"font-weight:bolder;";

                    tmpStyle += (Math.floor(Math.random() * 2) == 1)? "font-weight:bolder;":"";

					
                    this.code_chose += _code_chars[charNum];

                    code += '<font style="'+tmpStyle+'">'+_code_chars[charNum]+'</font>';

                }

            }else {        //算法验证码

    			
                var num1 = Math.floor(Math.random() * this.options.figure);

                var num2 = Math.floor(Math.random() * this.options.figure);

    			
                if(this.options.arith == 0) {

                    var tmparith = Math.floor(Math.random() * 3);

                }

    			
                switch(tmparith) {

                    case 1 :

                        this.code_chose = parseInt(num1) + parseInt(num2);

                        code = num1 + ' + ' + num2 + ' = ?';

                        break;

                    case 2 :

                        if(parseInt(num1) < parseInt(num2)) {

                            var tmpnum = num1;

                            num1 = num2;

                            num2 = tmpnum;

                        }

                        this.code_chose = parseInt(num1) - parseInt(num2);

                        code = num1 + ' - ' + num2 + ' = ?';

                        break;

                    default :

                        this.code_chose = parseInt(num1) * parseInt(num2);

                        code = num1 + ' × ' + num2 + ' = ?';

                        break;

                }

            }

    		
            this.htmlDoms.code.html(code);

    		
        },

    	
        //比对验证码

        checkCode : function() {

            if(this.options.type == 1) {        //普通验证码

                var own_input = this.htmlDoms.code_input.val().toUpperCase();

                this.code_chose = this.code_chose.toUpperCase();

            }else {

                var own_input = this.htmlDoms.code_input.val();

            }

    		
            if(own_input == this.code_chose) {

                this.options.success();

            }else {

                this.options.error();

                this.setCode();

            }

        }

    };

    
    
    //定义Slide的构造函数

    var Slide = function(ele, opt) {

        this.$element = ele,

        this.defaults = {

        	
            type : 1,

            vOffset: 5,

            vSpace : 5,

            imgName : ['1.jpg', '2.jpg'],

            imgSize : {

                width: '400px',

                height: '200px',

            },

            blockSize : {

                width: '50px',

                height: '50px',

            },

            barSize : {

                width : '400px',

                height : '40px',

            },

            ready : function(){},

            success : function(){},

            error : function(){}

            
        },

        this.options = $.extend({}, this.defaults, opt)

    };

    
    
    //定义Slide的方法

    Slide.prototype = {

        
        init: function() {

            var _this = this;

        	
            //加载页面

            this.loadDom();

            this.options.ready();

        	
            this.$element[0].onselectstart = document.body.ondrag = function(){ 
                return false; 
            };

        	
            //按下

            this.htmlDoms.move_block.on('touchstart', function(e) {

                _this.start(e);

            });

        	
            this.htmlDoms.move_block.on('mousedown', function(e) {

                _this.start(e);

            });

        	
            //拖动

            window.addEventListener("touchmove", function(e) {

                _this.move(e);

            });

            window.addEventListener("mousemove", function(e) {

                _this.move(e);

            });

            
            //鼠标松开

            window.addEventListener("touchend", function() {

                _this.end();

            });

            window.addEventListener("mouseup", function() {

                _this.end();

            });

            
            //刷新

            _this.$element.find('.verify-refresh').on('click', function() {

                _this.refresh();

            });

        },

        
        //初始化加载

        loadDom : function() {

            this.img_rand = Math.floor(Math.random() * this.options.imgName.length);            //随机的背景图片

        	
            var panelHtml = '';

            var tmpHtml = '';

        	
            if(this.options.type != 1) {        //图片滑动

                panelHtml += '<div class="verify-img-panel"><div  class="verify-refresh"><i class="iconfont icon-refresh"></i></div><div class="verify-gap"></div></div>';

                tmpHtml = '<div  class="verify-sub-block"></div>';

            }

        	
            panelHtml += '<div class="verify-bar-area"><span  class="verify-msg">向右滑动完成验证</span><div class="verify-left-bar"><span  class="verify-msg"></span><div  class="verify-move-block"><i  class="verify-icon iconfont icon-right"></i>'+tmpHtml+'</div></div></div>';

            this.$element.append(panelHtml);

        	
            this.htmlDoms = {

                gap : this.$element.find('.verify-gap'),

                sub_block : this.$element.find('.verify-sub-block'),

                img_panel : this.$element.find('.verify-img-panel'),

                bar_area : this.$element.find('.verify-bar-area'),

                move_block : this.$element.find('.verify-move-block'),

                left_bar : this.$element.find('.verify-left-bar'),

                msg : this.$element.find('.verify-msg'),

                icon : this.$element.find('.verify-icon'),

                refresh :this.$element.find('.verify-refresh')

            };

        	
            this.status = false;    //鼠标状态

            this.setSize = this.resetSize(this);    //重新设置宽度高度

        	
            this.htmlDoms.gap.css({'width': this.options.blockSize.width, 'height': this.options.blockSize.height});

            this.htmlDoms.sub_block.css({'width': this.options.blockSize.width, 'height': this.options.blockSize.height});

            this.htmlDoms.img_panel.css({'width': this.setSize.img_width, 'height': this.setSize.img_height, 'background': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size' : this.setSize.img_width + ' '+ this.setSize.img_height});

            this.htmlDoms.bar_area.css({'width': this.setSize.bar_width, 'height': this.options.barSize.height, 'line-height':this.options.barSize.height});

            this.htmlDoms.move_block.css({'width': this.options.barSize.height, 'height': this.options.barSize.height});

            this.htmlDoms.left_bar.css({'width': this.options.barSize.height, 'height': this.options.barSize.height});

        	
            this.randSet();

        },

        
        //鼠标按下

        start: function(e) {

            this.htmlDoms.msg.text('');

            this.htmlDoms.move_block.css('background-color', '#337ab7');

            this.htmlDoms.left_bar.css('border-color', '#337AB7');

            this.htmlDoms.icon.css('color', '#fff');

            e.stopPropagation();

            this.status = true;

        	
        },

        
        //鼠标移动

        move: function(e) {

            if(this.status) {

                if(!e.touches) {    //兼容移动端

                    var x = e.clientX;

                }else {     //兼容PC端

                    var x = e.touches[0].pageX;

                }

                var bar_area_left = Slide.prototype.getLeft(this.htmlDoms.bar_area[0]); 
                var move_block_left = x - bar_area_left; //小方块相对于父元素的left值

	            
	            
                if(this.options.type != 1) {        //图片滑动

                    if(move_block_left >= this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.blockSize.width)/2) - 2) {

                        move_block_left = this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.blockSize.width)/2) - 2;

                    }

	            	
	            	
	            	
	            	
	            	
                }else {        //普通滑动

                    if(move_block_left >= this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.barSize.height)/2) + 3) {

                        this.$element.find('.verify-msg:eq(1)').text('松开验证');

                        move_block_left = this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.barSize.height)/2) + 3;

                    }else {

                        this.$element.find('.verify-msg:eq(1)').text('');

                    }

                }

	            
	            
                if(move_block_left <= 0) {

                    move_block_left = parseInt(parseInt(this.options.blockSize.width)/2);

                }

	            
                //拖动后小方块的left值

                this.htmlDoms.move_block.css('left', move_block_left-parseInt(parseInt(this.options.blockSize.width)/2) + "px");

                this.htmlDoms.left_bar.css('width', move_block_left-parseInt(parseInt(this.options.blockSize.width)/2) + "px");

            }

        },

        
        //鼠标松开

        end: function() {

        	
            var _this = this;

        	
            //判断是否重合

            if(this.status) {

        		
                if(this.options.type != 1) {        //图片滑动

        			
                    var vOffset = parseInt(this.options.vOffset);

                    if(parseInt(this.htmlDoms.gap.css('left')) >= (parseInt(this.htmlDoms.move_block.css('left')) - vOffset) && parseInt(this.htmlDoms.gap.css('left')) <= (parseInt(this.htmlDoms.move_block.css('left')) + vOffset)) {

                        this.htmlDoms.move_block.css('background-color', '#5cb85c');

                        this.htmlDoms.left_bar.css({'border-color': '#5cb85c', 'background-color': '#fff'});

                        this.htmlDoms.icon.css('color', '#fff');

                        this.htmlDoms.icon.removeClass('icon-right');

                        this.htmlDoms.icon.addClass('icon-check');

                        this.htmlDoms.refresh.hide();

                        this.htmlDoms.move_block.unbind('mousedown touchstart');

                        this.options.success();

                    }else{

                        this.htmlDoms.move_block.css('background-color', '#d9534f');

                        this.htmlDoms.left_bar.css('border-color', '#d9534f');

                        this.htmlDoms.icon.css('color', '#fff');

                        this.htmlDoms.icon.removeClass('icon-right');

                        this.htmlDoms.icon.addClass('icon-close');

		            	
                        setTimeout(function () { 
                            _this.htmlDoms.move_block.animate({'left':'0px'}, 'fast');

                            _this.htmlDoms.left_bar.animate({'width': '40px'}, 'fast');

                            _this.htmlDoms.left_bar.css({'border-color': '#ddd'});

					    	
                            _this.htmlDoms.move_block.css('background-color', '#fff');

                            _this.htmlDoms.icon.css('color', '#000');

                            _this.htmlDoms.icon.removeClass('icon-close');

                            _this.htmlDoms.icon.addClass('icon-right');

                            _this.$element.find('.verify-msg:eq(0)').text('向右滑动完成验证');

					    	
                        }, 400);

		            	
                        this.options.error();

                    }

        			
                }else {        //普通滑动

        			
                    if(parseInt(this.htmlDoms.move_block.css('left')) >= (parseInt(this.setSize.bar_width) - parseInt(this.options.barSize.height) - parseInt(this.options.vOffset))) {

                        this.htmlDoms.move_block.css('background-color', '#5cb85c');

                        this.htmlDoms.left_bar.css({'color': '#4cae4c', 'border-color': '#5cb85c', 'background-color': '#fff' });

                        this.htmlDoms.icon.css('color', '#fff');

                        this.htmlDoms.icon.removeClass('icon-right');

                        this.htmlDoms.icon.addClass('icon-check');

                        this.htmlDoms.refresh.hide();

                        this.htmlDoms.move_block.unbind('mousedown');

                        this.htmlDoms.move_block.unbind('touchstart');

                        this.$element.find('.verify-msg:eq(1)').text('验证成功');

                        this.options.success();

                    }else {

        				
                        this.htmlDoms.move_block.css('background-color', '#d9534f');

                        this.htmlDoms.left_bar.css('border-color', '#d9534f');

                        this.htmlDoms.icon.css('color', '#fff');

                        this.htmlDoms.icon.removeClass('icon-right');

                        this.htmlDoms.icon.addClass('icon-close');

		            	
                        setTimeout(function () { 
                            _this.htmlDoms.move_block.animate({'left':'0px'}, 'fast');

                            _this.htmlDoms.left_bar.animate({'width': '40px'}, 'fast');

                            _this.htmlDoms.left_bar.css({'border-color': '#ddd'});

					    	
                            _this.htmlDoms.move_block.css('background-color', '#fff');

                            _this.htmlDoms.icon.css('color', '#000');

                            _this.htmlDoms.icon.removeClass('icon-close');

                            _this.htmlDoms.icon.addClass('icon-right');

                            _this.$element.find('.verify-msg:eq(0)').text('向右滑动解锁');

					    	
                        }, 400);

		            	
                        this.options.error();

                    }

                }

        		
                this.status = false;

            }

        },

        
        
        resetSize : function(obj) {

            var img_width,img_height,bar_width,bar_height;    //图片的宽度、高度，移动条的宽度、高度

            var parentWidth = obj.$element.parent().width() || $(window).width();

            var parentHeight = obj.$element.parent().height() || $(window).height();

        	
               if(obj.options.imgSize.width.indexOf('%')!= -1){

                img_width = parseInt(obj.options.imgSize.width)/100 * parentWidth + 'px';

        　　}else {

                img_width = obj.options.imgSize.width;

            }

		
            if(obj.options.imgSize.height.indexOf('%')!= -1){

                img_height = parseInt(obj.options.imgSize.height)/100 * parentHeight + 'px';

        　　}else {

                img_height = obj.options.imgSize.height;

            }

		
            if(obj.options.barSize.width.indexOf('%')!= -1){

                bar_width = parseInt(obj.options.barSize.width)/100 * parentWidth + 'px';

        　　}else {

                bar_width = obj.options.barSize.width;

            }

		
            if(obj.options.barSize.height.indexOf('%')!= -1){

                bar_height = parseInt(obj.options.barSize.height)/100 * parentHeight + 'px';

        　　}else {

                bar_height = obj.options.barSize.height;

            }

		
            return {img_width : img_width, img_height : img_height, bar_width : bar_width, bar_height : bar_height};

           },

        
        //随机出生点位

        randSet: function() {

            var rand1 = Math.floor(Math.random()*9+1);

            var rand2 = Math.floor(Math.random()*9+1);

            var top = rand1 * parseInt(this.setSize.img_height)/15 + parseInt(this.setSize.img_height) * 0.1;

            var left = rand2 * parseInt(this.setSize.img_width)/15 + parseInt(this.setSize.img_width) * 0.1;

        	
            this.$element.find('.verify-img-panel').css('margin-bottom', this.options.vSpace + 'px');

            this.$element.find('.verify-gap').css({'top': top, 'left': left});

              this.$element.find('.verify-sub-block').css({'top':'-'+(parseInt(this.setSize.img_height)- top + this.options.vSpace + 2)+'px', 'background-image': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height,'background-position-y': '-'+top+ 'px', 'background-position-x': '-'+left+'px'});

        },

        
        //刷新

        refresh: function() {

            this.randSet();

            this.img_rand = Math.floor(Math.random() * this.options.imgName.length);            //随机的背景图片

            this.$element.find('.verify-img-panel').css({'background': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height});

            this.$element.find('.verify-sub-block').css({'background-image': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height});

        },

        
        //获取left值

        getLeft: function(node) {

            var left = $(node).offset().left; 
//          var nowPos = node.offsetParent; 	
//          
//          while(nowPos != null) {　　

//              left += $(nowPos).offset().left;　

//              nowPos = nowPos.offsetParent;　　

//          }

            return left;

        }

    };

    
    
    //定义Points的构造函数

    var Points = function(ele, opt) {

        this.$element = ele,

        this.defaults = {

            defaultNum : 4,    //默认的文字数量

            checkNum : 3,    //校对的文字数量

            vSpace : 5,    //间隔

            imgName : ['1.jpg', '2.jpg'],

            imgSize : {

                width: '400px',

                height: '200px',

            },

            barSize : {

                width : '400px',

                height : '40px',

            },

            ready : function(){},

            success : function(){},

            error : function(){}

        },

        this.options = $.extend({}, this.defaults, opt)

    };

    
    //定义Points的方法

    Points.prototype = {

        init : function() {

			
            var _this = this;

			
            //加载页面

            _this.loadDom();

        	 
            _this.refresh();

            _this.options.ready();

        	
            this.$element[0].onselectstart = document.body.ondrag = function(){ 
                return false; 
            };

        	
             //点击事件比对

            _this.$element.find('.verify-img-panel canvas').on('click', function(e) {

        		
                _this.checkPosArr.push(_this.getMousePos(this, e));

				
                if(_this.num == _this.options.checkNum) {

					
                    _this.num = _this.createPoint(_this.getMousePos(this, e));

                    setTimeout(function () { 
                        var flag = _this.comparePos(_this.fontPos, _this.checkPosArr);

						
                        if(flag == false) {    //验证失败

							
                            _this.options.error();

                            _this.$element.find('.verify-bar-area').css({'color': '#d9534f', 'border-color': '#d9534f'});

                            _this.$element.find('.verify-msg').text('验证失败');

							
                            setTimeout(function () { 
                                _this.$element.find('.verify-bar-area').css({'color': '#000','border-color': '#ddd'});

                                _this.refresh();

                            }, 400);

							
                        }else {    //验证成功

                            _this.$element.find('.verify-bar-area').css({'color': '#4cae4c', 'border-color': '#5cb85c'});

                            _this.$element.find('.verify-msg').text('验证成功');

                            _this.$element.find('.verify-refresh').hide();

                            _this.$element.find('.verify-img-panel').unbind('click');

                            _this.options.success();

                        }

                    }, 400);

					
                }

				
                if(_this.num < _this.options.checkNum) {

                    _this.num = _this.createPoint(_this.getMousePos(this, e));

                }



            });

        	
             //刷新

            _this.$element.find('.verify-refresh').on('click', function() {

                _this.refresh();

            });

        	
        },

    	
    	
    	
        //加载页面

        loadDom : function() {

    		
            this.fontPos = [];    //选中的坐标信息

            this.checkPosArr = [];    //用户点击的坐标

            this.num = 1;    //点击的记数

            this.img_rand = Math.floor(Math.random() * this.options.imgName.length);            //随机的背景图片

    		
            var panelHtml = '';

            var tmpHtml = '';

        	
            this.setSize = Slide.prototype.resetSize(this);    //重新设置宽度高度

        	
            panelHtml += '<div class="verify-img-panel"><div  class="verify-refresh" style="z-index:9999"><i class="iconfont icon-refresh"></i></div><canvas width="'+this.setSize.img_width+'" height="'+this.setSize.img_height+'"></canvas></div><div class="verify-bar-area"><span  class="verify-msg"></span></div>';

        	
            this.$element.append(panelHtml);

        	
        	
            this.htmlDoms = {

                img_panel : this.$element.find('.verify-img-panel'),

                bar_area : this.$element.find('.verify-bar-area'),

                msg : this.$element.find('.verify-msg'),

            };

        	
            this.htmlDoms.img_panel.css({'width': this.setSize.img_width, 'height': this.setSize.img_height, 'background-size' : this.setSize.img_width + ' '+ this.setSize.img_height, 'margin-bottom': this.options.vSpace + 'px'});

            this.htmlDoms.bar_area.css({'width': this.options.barSize.width, 'height': this.options.barSize.height, 'line-height':this.options.barSize.height});

    		
        },

    	
        //绘制合成的图片

        drawImg : function(obj, img) {

            //准备canvas环境 
               var canvas = this.$element.find('canvas')[0];

              //var canvas=document.getElementById("myCanvas");

               var ctx=canvas.getContext("2d");

	       	
               // 绘制图片

               ctx.drawImage(img,0,0, parseInt(this.setSize.img_width), parseInt(this.setSize.img_height));

	       	
               // 绘制水印

               var fontSizeArr = ['italic small-caps bold 20px microsoft yahei', 'small-caps normal 25px arial', '34px microsoft yahei'];

               var fontStr = '天地玄黄宇宙洪荒日月盈昃辰宿列张寒来暑往秋收冬藏闰余成岁律吕调阳云腾致雨露结为霜金生丽水玉出昆冈剑号巨阙珠称夜光果珍李柰菜重芥姜海咸河淡鳞潜羽翔龙师火帝鸟官人皇始制文字乃服衣裳推位让国有虞陶唐吊民伐罪周发殷汤坐朝问道垂拱平章爱育黎首臣伏戎羌遐迩体率宾归王';    //不重复的汉字

	       	
	       	
               var fontChars = [];

	       	
               var avg = Math.floor(parseInt(this.setSize.img_width)/(parseInt(this.options.defaultNum)+1));

               var tmp_index = '';

               var color2Num = Math.floor(Math.random() * 5);

	       	
               for(var i = 1; i <= this.options.defaultNum; i++) {

	       		
                   fontChars[i-1] = this.getChars(fontStr, fontChars);

	       		
                   tmp_index = Math.floor(Math.random()*3);

                   ctx.font = fontSizeArr[tmp_index];

                   ctx.fillStyle = _code_color2[color2Num];

		       	
                   if(Math.floor(Math.random() * 2) == 1) {

                       var tmp_y = Math.floor(parseInt(this.setSize.img_height)/2) + tmp_index*20 + 20;

                   }else {

                       var tmp_y = Math.floor(parseInt(this.setSize.img_height)/2) - tmp_index*20;

                   }

		       	
                   ctx.fillText(fontChars[i-1],avg * i, tmp_y);

                   this.fontPos[i-1] = {'char': fontChars[i-1], 'x': avg * i, 'y': tmp_y};

		       	
               }

	       	
               for(var i = 0; i < (this.options.defaultNum-this.options.checkNum); i++) {

                   this.shuffle(this.fontPos).pop();

               }

	       	
               var msgStr = '';

               for(var i = 0; i < this.fontPos.length; i++) {

                   msgStr += this.fontPos[i].char + ',';

               }

	       	
               this.htmlDoms.msg.text('请顺序点击【' + msgStr.substring(0,msgStr.length-1) + '】');

	       	
               return this.fontPos;

        },

    	
        //获取坐标

        getMousePos :function(obj, event) {

            var e = event || window.event;

            var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;

            var scrollY = document.documentElement.scrollTop || document.body.scrollTop;

            var x = e.clientX - ($(obj).offset().left - $(window).scrollLeft());

            var y = e.clientY - ($(obj).offset().top - $(window).scrollTop());

    		
            return {'x': x, 'y': y};

         },

     	
         //递归去重

         getChars : function(fontStr, fontChars) {

     		
             var tmp_rand = parseInt(Math.floor(Math.random() * fontStr.length));

             if(tmp_rand > 0) {

                 tmp_rand = tmp_rand - 1;

             }

     		
             tmp_char = fontStr.charAt(tmp_rand);

               if($.inArray(tmp_char, fontChars) == -1) {

                   return tmp_char;

               }else {

                   return Points.prototype.getChars(fontStr, fontChars);

               }

         },

		
        //洗牌数组

           shuffle : function(arr) {

            var m = arr.length, i;

            while (m) {

                i = (Math.random() * m--) >>> 0;

                [arr[m], arr[i]] = [arr[i], arr[m]]

            }

            return arr;

        },

       	
           //创建坐标点

           createPoint : function (pos) {

               this.htmlDoms.img_panel.append('<div class="point-area" style="background-color:#1abd6c;color:#fff;z-index:9999;width:30px;height:30px;text-align:center;line-height:30px;border-radius: 50%;position:absolute;top:'+parseInt(pos.y-10)+'px;left:'+parseInt(pos.x-10)+'px;">'+this.num+'</div>');

               return ++this.num;

           },

       	
           //比对坐标点

           comparePos : function (fontPos, checkPosArr) {

       		
               var flag = true;

               for(var i = 0; i < fontPos.length; i++) {

                   if(!(parseInt(checkPosArr[i].x) + 40 > fontPos[i].x && parseInt(checkPosArr[i].x) - 40 < fontPos[i].x && parseInt(checkPosArr[i].y) + 40 > fontPos[i].y && parseInt(checkPosArr[i].y) - 40 < fontPos[i].y)) {

                       flag = false;

                       break;

                   }

               }

       		
               return flag;

           },

       	
           //刷新

        refresh: function() {

            var _this = this;

            this.$element.find('.point-area').remove();

            this.fontPos = [];

            this.checkPosArr = [];

            this.num = 1;

        	
            this.img_rand = Math.floor(Math.random() * this.options.imgName.length);            //随机的背景图片

            var img = new Image();

            img.src = 'images/'+this.options.imgName[this.img_rand];

		 	
		 	
             // 加载完成开始绘制

             $(img).on('load', function(e) {

                this.fontPos = _this.drawImg(_this, this);

            });



        },

    	
    };

    
    //在插件中使用codeVerify对象

    $.fn.codeVerify = function(options, callbacks) {

        var code = new Code(this, options);

        code.init();

    };

    
    //在插件中使用slideVerify对象

    $.fn.slideVerify = function(options, callbacks) {

        var slide = new Slide(this, options);

        slide.init();

    };

    
    //在插件中使用clickVerify对象

    $.fn.pointsVerify = function(options, callbacks) {

        var points = new Points(this, options);

        points.init();

    };

   
})(jQuery, window, document);


 gx_tieta/WebRoot/js/verify/js/verify.min.js

New file
@@ -0,0 +1,2 @@
/*! Verify-v0.1.0 MIT License by 大熊*/

;(function($,window,document,undefined){var Code=function(ele,opt){this.$element=ele,this.defaults={type:1,figure:100,arith:0,width:'200px',height:'60px',fontSize:'30px',codeLength:6,btnId:'check-btn',ready:function(){},success:function(){},error:function(){}},this.options=$.extend({},this.defaults,opt)};var _code_chars=[0,1,2,3,4,5,6,7,8,9,'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];var _code_color1=['#fffff0','#f0ffff','#f0fff0','#fff0f0'];var _code_color2=['#FF0033','#006699','#993366','#FF9900','#66CC66','#FF33CC'];Code.prototype={init:function(){var _this=this;this.loadDom();this.setCode();this.options.ready();this.$element[0].onselectstart=document.body.ondrag=function(){return false};this.$element.find('.verify-code, .verify-change-code').on('click',function(){_this.setCode()});this.htmlDoms.code_btn.on('click',function(){_this.checkCode()})},loadDom:function(){var panelHtml='<div class="cerify-code-panel"><div class="verify-code"></div><div class="verify-code-area"><div class="verify-input-area"><input type="text" class="varify-input-code" /></div><div class="verify-change-area"><a class="verify-change-code">换一张</a></div></div></div>';this.$element.append(panelHtml);this.htmlDoms={code_btn:$('#'+this.options.btnId),code:this.$element.find('.verify-code'),code_area:this.$element.find('.verify-code-area'),code_input:this.$element.find('.varify-input-code'),};this.htmlDoms.code.css({'width':this.options.width,'height':this.options.height,'line-height':this.options.height,'font-size':this.options.fontSize});this.htmlDoms.code_area.css({'width':this.options.width})},setCode:function(){var color1Num=Math.floor(Math.random()*3);var color2Num=Math.floor(Math.random()*5);this.htmlDoms.code.css({'background-color':_code_color1[color1Num],'color':_code_color2[color2Num]});this.htmlDoms.code_input.val('');var code='';this.code_chose='';if(this.options.type==1){for(var i=0;i<this.options.codeLength;i++){var charNum=Math.floor(Math.random()*52);var tmpStyle=(charNum%2==0)?"font-style:italic;margin-right: 10px;":"font-weight:bolder;";tmpStyle+=(Math.floor(Math.random()*2)==1)?"font-weight:bolder;":"";this.code_chose+=_code_chars[charNum];code+='<font style="'+tmpStyle+'">'+_code_chars[charNum]+'</font>'}}else{var num1=Math.floor(Math.random()*this.options.figure);var num2=Math.floor(Math.random()*this.options.figure);if(this.options.arith==0){var tmparith=Math.floor(Math.random()*3)}switch(tmparith){case 1:this.code_chose=parseInt(num1)+parseInt(num2);code=num1+' + '+num2+' = ?';break;case 2:if(parseInt(num1)<parseInt(num2)){var tmpnum=num1;num1=num2;num2=tmpnum}this.code_chose=parseInt(num1)-parseInt(num2);code=num1+' - '+num2+' = ?';break;default:this.code_chose=parseInt(num1)*parseInt(num2);code=num1+' × '+num2+' = ?';break}}this.htmlDoms.code.html(code)},checkCode:function(){if(this.options.type==1){var own_input=this.htmlDoms.code_input.val().toUpperCase();this.code_chose=this.code_chose.toUpperCase()}else{var own_input=this.htmlDoms.code_input.val()}if(own_input==this.code_chose){this.options.success()}else{this.options.error();this.setCode()}}};var Slide=function(ele,opt){this.$element=ele,this.defaults={type:1,vOffset:5,vSpace:5,imgName:['1.jpg','2.jpg'],imgSize:{width:'400px',height:'200px',},blockSize:{width:'50px',height:'50px',},barSize:{width:'400px',height:'40px',},ready:function(){},success:function(){},error:function(){}},this.options=$.extend({},this.defaults,opt)};Slide.prototype={init:function(){var _this=this;this.loadDom();this.options.ready();this.$element[0].onselectstart=document.body.ondrag=function(){return false};this.htmlDoms.move_block.on('touchstart',function(e){_this.start(e)});this.htmlDoms.move_block.on('mousedown',function(e){_this.start(e)});window.addEventListener("touchmove",function(e){_this.move(e)});window.addEventListener("mousemove",function(e){_this.move(e)});window.addEventListener("touchend",function(){_this.end()});window.addEventListener("mouseup",function(){_this.end()});_this.$element.find('.verify-refresh').on('click',function(){_this.refresh()})},loadDom:function(){this.img_rand=Math.floor(Math.random()*this.options.imgName.length);var panelHtml='';var tmpHtml='';if(this.options.type!=1){panelHtml+='<div class="verify-img-panel"><div  class="verify-refresh"><i class="iconfont icon-refresh"></i></div><div class="verify-gap"></div></div>';tmpHtml='<div  class="verify-sub-block"></div>'}panelHtml+='<div class="verify-bar-area"><span  class="verify-msg">向右滑动完成验证</span><div class="verify-left-bar"><span  class="verify-msg"></span><div  class="verify-move-block"><i  class="verify-icon iconfont icon-right"></i>'+tmpHtml+'</div></div></div>';this.$element.append(panelHtml);this.htmlDoms={gap:this.$element.find('.verify-gap'),sub_block:this.$element.find('.verify-sub-block'),img_panel:this.$element.find('.verify-img-panel'),bar_area:this.$element.find('.verify-bar-area'),move_block:this.$element.find('.verify-move-block'),left_bar:this.$element.find('.verify-left-bar'),msg:this.$element.find('.verify-msg'),icon:this.$element.find('.verify-icon'),refresh:this.$element.find('.verify-refresh')};this.status=false;this.setSize=this.resetSize(this);this.htmlDoms.gap.css({'width':this.options.blockSize.width,'height':this.options.blockSize.height});this.htmlDoms.sub_block.css({'width':this.options.blockSize.width,'height':this.options.blockSize.height});this.htmlDoms.img_panel.css({'width':this.setSize.img_width,'height':this.setSize.img_height,'background':'url(images/'+this.options.imgName[this.img_rand]+')','background-size':this.setSize.img_width+' '+this.setSize.img_height});this.htmlDoms.bar_area.css({'width':this.setSize.bar_width,'height':this.options.barSize.height,'line-height':this.options.barSize.height});this.htmlDoms.move_block.css({'width':this.options.barSize.height,'height':this.options.barSize.height});this.htmlDoms.left_bar.css({'width':this.options.barSize.height,'height':this.options.barSize.height});this.randSet()},start:function(e){this.htmlDoms.msg.text('');this.htmlDoms.move_block.css('background-color','#337ab7');this.htmlDoms.left_bar.css('border-color','#337AB7');this.htmlDoms.icon.css('color','#fff');e.stopPropagation();this.status=true},move:function(e){if(this.status){if(!e.touches){var x=e.clientX}else{var x=e.touches[0].pageX}var bar_area_left=Slide.prototype.getLeft(this.htmlDoms.bar_area[0]);var move_block_left=x-bar_area_left;if(this.options.type!=1){if(move_block_left>=this.htmlDoms.bar_area[0].offsetWidth-parseInt(parseInt(this.options.blockSize.width)/2)-2){move_block_left=this.htmlDoms.bar_area[0].offsetWidth-parseInt(parseInt(this.options.blockSize.width)/2)-2}}else{if(move_block_left>=this.htmlDoms.bar_area[0].offsetWidth-parseInt(parseInt(this.options.barSize.height)/2)+3){this.$element.find('.verify-msg:eq(1)').text('松开验证');move_block_left=this.htmlDoms.bar_area[0].offsetWidth-parseInt(parseInt(this.options.barSize.height)/2)+3}else{this.$element.find('.verify-msg:eq(1)').text('')}}if(move_block_left<=0){move_block_left=parseInt(parseInt(this.options.blockSize.width)/2)}this.htmlDoms.move_block.css('left',move_block_left-parseInt(parseInt(this.options.blockSize.width)/2)+"px");this.htmlDoms.left_bar.css('width',move_block_left-parseInt(parseInt(this.options.blockSize.width)/2)+"px")}},end:function(){var _this=this;if(this.status){if(this.options.type!=1){var vOffset=parseInt(this.options.vOffset);if(parseInt(this.htmlDoms.gap.css('left'))>=(parseInt(this.htmlDoms.move_block.css('left'))-vOffset)&&parseInt(this.htmlDoms.gap.css('left'))<=(parseInt(this.htmlDoms.move_block.css('left'))+vOffset)){this.htmlDoms.move_block.css('background-color','#5cb85c');this.htmlDoms.left_bar.css({'border-color':'#5cb85c','background-color':'#fff'});this.htmlDoms.icon.css('color','#fff');this.htmlDoms.icon.removeClass('icon-right');this.htmlDoms.icon.addClass('icon-check');this.htmlDoms.refresh.hide();this.htmlDoms.move_block.unbind('mousedown touchstart');this.options.success()}else{this.htmlDoms.move_block.css('background-color','#d9534f');this.htmlDoms.left_bar.css('border-color','#d9534f');this.htmlDoms.icon.css('color','#fff');this.htmlDoms.icon.removeClass('icon-right');this.htmlDoms.icon.addClass('icon-close');setTimeout(function(){_this.htmlDoms.move_block.animate({'left':'0px'},'fast');_this.htmlDoms.left_bar.animate({'width':'40px'},'fast');_this.htmlDoms.left_bar.css({'border-color':'#ddd'});_this.htmlDoms.move_block.css('background-color','#fff');_this.htmlDoms.icon.css('color','#000');_this.htmlDoms.icon.removeClass('icon-close');_this.htmlDoms.icon.addClass('icon-right');_this.$element.find('.verify-msg:eq(0)').text('向右滑动完成验证')},400);this.options.error()}}else{if(parseInt(this.htmlDoms.move_block.css('left'))>=(parseInt(this.setSize.bar_width)-parseInt(this.options.barSize.height)-parseInt(this.options.vOffset))){this.htmlDoms.move_block.css('background-color','#5cb85c');this.htmlDoms.left_bar.css({'color':'#4cae4c','border-color':'#5cb85c','background-color':'#fff'});this.htmlDoms.icon.css('color','#fff');this.htmlDoms.icon.removeClass('icon-right');this.htmlDoms.icon.addClass('icon-check');this.htmlDoms.refresh.hide();this.htmlDoms.move_block.unbind('mousedown');this.htmlDoms.move_block.unbind('touchstart');this.$element.find('.verify-msg:eq(1)').text('验证成功');this.options.success()}else{this.htmlDoms.move_block.css('background-color','#d9534f');this.htmlDoms.left_bar.css('border-color','#d9534f');this.htmlDoms.icon.css('color','#fff');this.htmlDoms.icon.removeClass('icon-right');this.htmlDoms.icon.addClass('icon-close');setTimeout(function(){_this.htmlDoms.move_block.animate({'left':'0px'},'fast');_this.htmlDoms.left_bar.animate({'width':'40px'},'fast');_this.htmlDoms.left_bar.css({'border-color':'#ddd'});_this.htmlDoms.move_block.css('background-color','#fff');_this.htmlDoms.icon.css('color','#000');_this.htmlDoms.icon.removeClass('icon-close');_this.htmlDoms.icon.addClass('icon-right');_this.$element.find('.verify-msg:eq(0)').text('向右滑动解锁')},400);this.options.error()}}this.status=false}},resetSize:function(obj){var img_width,img_height,bar_width,bar_height;var parentWidth=obj.$element.parent().width()||$(window).width();var parentHeight=obj.$element.parent().height()||$(window).height();if(obj.options.imgSize.width.indexOf('%')!=-1){img_width=parseInt(obj.options.imgSize.width)/100*parentWidth+'px'}else{img_width=obj.options.imgSize.width}if(obj.options.imgSize.height.indexOf('%')!=-1){img_height=parseInt(obj.options.imgSize.height)/100*parentHeight+'px'}else{img_height=obj.options.imgSize.height}if(obj.options.barSize.width.indexOf('%')!=-1){bar_width=parseInt(obj.options.barSize.width)/100*parentWidth+'px'}else{bar_width=obj.options.barSize.width}if(obj.options.barSize.height.indexOf('%')!=-1){bar_height=parseInt(obj.options.barSize.height)/100*parentHeight+'px'}else{bar_height=obj.options.barSize.height}return{img_width:img_width,img_height:img_height,bar_width:bar_width,bar_height:bar_height}},randSet:function(){var rand1=Math.floor(Math.random()*9+1);var rand2=Math.floor(Math.random()*9+1);var top=rand1*parseInt(this.setSize.img_height)/15+parseInt(this.setSize.img_height)*0.1;var left=rand2*parseInt(this.setSize.img_width)/15+parseInt(this.setSize.img_width)*0.1;this.$element.find('.verify-img-panel').css('margin-bottom',this.options.vSpace+'px');this.$element.find('.verify-gap').css({'top':top,'left':left});this.$element.find('.verify-sub-block').css({'top':'-'+(parseInt(this.setSize.img_height)-top+this.options.vSpace+2)+'px','background-image':'url(images/'+this.options.imgName[this.img_rand]+')','background-size':this.setSize.img_width+' '+this.setSize.img_height,'background-position-y':'-'+top+'px','background-position-x':'-'+left+'px'})},refresh:function(){this.randSet();this.img_rand=Math.floor(Math.random()*this.options.imgName.length);this.$element.find('.verify-img-panel').css({'background':'url(images/'+this.options.imgName[this.img_rand]+')','background-size':this.setSize.img_width+' '+this.setSize.img_height});this.$element.find('.verify-sub-block').css({'background-image':'url(images/'+this.options.imgName[this.img_rand]+')','background-size':this.setSize.img_width+' '+this.setSize.img_height})},getLeft:function(node){var left=$(node).offset().left;return left}};var Points=function(ele,opt){this.$element=ele,this.defaults={defaultNum:4,checkNum:3,vSpace:5,imgName:['1.jpg','2.jpg'],imgSize:{width:'400px',height:'200px',},barSize:{width:'400px',height:'40px',},ready:function(){},success:function(){},error:function(){}},this.options=$.extend({},this.defaults,opt)};Points.prototype={init:function(){var _this=this;_this.loadDom();_this.refresh();_this.options.ready();this.$element[0].onselectstart=document.body.ondrag=function(){return false};_this.$element.find('.verify-img-panel canvas').on('click',function(e){_this.checkPosArr.push(_this.getMousePos(this,e));if(_this.num==_this.options.checkNum){_this.num=_this.createPoint(_this.getMousePos(this,e));setTimeout(function(){var flag=_this.comparePos(_this.fontPos,_this.checkPosArr);if(flag==false){_this.options.error();_this.$element.find('.verify-bar-area').css({'color':'#d9534f','border-color':'#d9534f'});_this.$element.find('.verify-msg').text('验证失败');setTimeout(function(){_this.$element.find('.verify-bar-area').css({'color':'#000','border-color':'#ddd'});_this.refresh()},400)}else{_this.$element.find('.verify-bar-area').css({'color':'#4cae4c','border-color':'#5cb85c'});_this.$element.find('.verify-msg').text('验证成功');_this.$element.find('.verify-refresh').hide();_this.$element.find('.verify-img-panel').unbind('click');_this.options.success()}},400)}if(_this.num<_this.options.checkNum){_this.num=_this.createPoint(_this.getMousePos(this,e))}});_this.$element.find('.verify-refresh').on('click',function(){_this.refresh()})},loadDom:function(){this.fontPos=[];this.checkPosArr=[];this.num=1;this.img_rand=Math.floor(Math.random()*this.options.imgName.length);var panelHtml='';var tmpHtml='';this.setSize=Slide.prototype.resetSize(this);panelHtml+='<div class="verify-img-panel"><div  class="verify-refresh" style="z-index:9999"><i class="iconfont icon-refresh"></i></div><canvas width="'+this.setSize.img_width+'" height="'+this.setSize.img_height+'"></canvas></div><div class="verify-bar-area"><span  class="verify-msg"></span></div>';this.$element.append(panelHtml);this.htmlDoms={img_panel:this.$element.find('.verify-img-panel'),bar_area:this.$element.find('.verify-bar-area'),msg:this.$element.find('.verify-msg'),};this.htmlDoms.img_panel.css({'width':this.setSize.img_width,'height':this.setSize.img_height,'background-size':this.setSize.img_width+' '+this.setSize.img_height,'margin-bottom':this.options.vSpace+'px'});this.htmlDoms.bar_area.css({'width':this.options.barSize.width,'height':this.options.barSize.height,'line-height':this.options.barSize.height})},drawImg:function(obj,img){var canvas=this.$element.find('canvas')[0];var ctx=canvas.getContext("2d");ctx.drawImage(img,0,0,parseInt(this.setSize.img_width),parseInt(this.setSize.img_height));var fontSizeArr=['italic small-caps bold 20px microsoft yahei','small-caps normal 25px arial','34px microsoft yahei'];var fontStr='天地玄黄宇宙洪荒日月盈昃辰宿列张寒来暑往秋收冬藏闰余成岁律吕调阳云腾致雨露结为霜金生丽水玉出昆冈剑号巨阙珠称夜光果珍李柰菜重芥姜海咸河淡鳞潜羽翔龙师火帝鸟官人皇始制文字乃服衣裳推位让国有虞陶唐吊民伐罪周发殷汤坐朝问道垂拱平章爱育黎首臣伏戎羌遐迩体率宾归王';var fontChars=[];var avg=Math.floor(parseInt(this.setSize.img_width)/(parseInt(this.options.defaultNum)+1));var tmp_index='';var color2Num=Math.floor(Math.random()*5);for(var i=1;i<=this.options.defaultNum;i++){fontChars[i-1]=this.getChars(fontStr,fontChars);tmp_index=Math.floor(Math.random()*3);ctx.font=fontSizeArr[tmp_index];ctx.fillStyle=_code_color2[color2Num];if(Math.floor(Math.random()*2)==1){var tmp_y=Math.floor(parseInt(this.setSize.img_height)/2)+tmp_index*20+20}else{var tmp_y=Math.floor(parseInt(this.setSize.img_height)/2)-tmp_index*20}ctx.fillText(fontChars[i-1],avg*i,tmp_y);this.fontPos[i-1]={'char':fontChars[i-1],'x':avg*i,'y':tmp_y}}for(var i=0;i<(this.options.defaultNum-this.options.checkNum);i++){this.shuffle(this.fontPos).pop()}var msgStr='';for(var i=0;i<this.fontPos.length;i++){msgStr+=this.fontPos[i].char+','}this.htmlDoms.msg.text('请顺序点击【'+msgStr.substring(0,msgStr.length-1)+'】');return this.fontPos},getMousePos:function(obj,event){var e=event||window.event;var scrollX=document.documentElement.scrollLeft||document.body.scrollLeft;var scrollY=document.documentElement.scrollTop||document.body.scrollTop;var x=e.clientX-($(obj).offset().left-$(window).scrollLeft());var y=e.clientY-($(obj).offset().top-$(window).scrollTop());return{'x':x,'y':y}},getChars:function(fontStr,fontChars){var tmp_rand=parseInt(Math.floor(Math.random()*fontStr.length));if(tmp_rand>0){tmp_rand=tmp_rand-1}tmp_char=fontStr.charAt(tmp_rand);if($.inArray(tmp_char,fontChars)==-1){return tmp_char}else{return Points.prototype.getChars(fontStr,fontChars)}},shuffle:function(arr){var m=arr.length,i;while(m){i=(Math.random()*m--)>>>0;[arr[m],arr[i]]=[arr[i],arr[m]]}return arr},createPoint:function(pos){this.htmlDoms.img_panel.append('<div class="point-area" style="background-color:#1abd6c;color:#fff;z-index:9999;width:30px;height:30px;text-align:center;line-height:30px;border-radius: 50%;position:absolute;top:'+parseInt(pos.y-10)+'px;left:'+parseInt(pos.x-10)+'px;">'+this.num+'</div>');return++this.num},comparePos:function(fontPos,checkPosArr){var flag=true;for(var i=0;i<fontPos.length;i++){if(!(parseInt(checkPosArr[i].x)+40>fontPos[i].x&&parseInt(checkPosArr[i].x)-40<fontPos[i].x&&parseInt(checkPosArr[i].y)+40>fontPos[i].y&&parseInt(checkPosArr[i].y)-40<fontPos[i].y)){flag=false;break}}return flag},refresh:function(){var _this=this;this.$element.find('.point-area').remove();this.fontPos=[];this.checkPosArr=[];this.num=1;this.img_rand=Math.floor(Math.random()*this.options.imgName.length);var img=new Image();img.src='images/'+this.options.imgName[this.img_rand];$(img).on('load',function(e){this.fontPos=_this.drawImg(_this,this)})},};$.fn.codeVerify=function(options,callbacks){var code=new Code(this,options);code.init()};$.fn.slideVerify=function(options,callbacks){var slide=new Slide(this,options);slide.init()};$.fn.pointsVerify=function(options,callbacks){var points=new Points(this,options);points.init()}})(jQuery,window,document);


 gx_tieta/WebRoot/login.jsp

@@ -46,6 +46,7 @@
    <link rel="stylesheet" href="jqueryui/jquery-ui.css">

    <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css">

    <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome-animation.min.css">

    <link rel="stylesheet" type="text/css" href="js/verify/css/verify.css">

    <script type="text/javascript" src="js/jquery-1.8.3.js"></script>

    <script type="text/javascript" src="jqueryui/jquery-ui.js"></script>

    <script type="text/javascript" src="js/qrcode.js"></script>

@@ -98,8 +99,20 @@
                <img src="image/loading-open.gif" alt="">

            </div>

        </div>

        <!-- 验证码登陆面板 -->

        <div class="hdw-dialog hdw-dialog-hide" id="lVerify-dialog">

            <div class="hdw-dialog-container">

                <div class="hdw-dialog-bg"></div>

                <div class="hdw-dialog-content hdw-dialog-width500-300">

                    <div class="hdw-dialog-content-container">

                        <div id="lVerify" ></div>

                    </div>

                </div>

            </div>

        </div>

    </div>

    <script type="text/javascript" src="js/nocontent.js"></script>

    <script type="text/javascript" src="js/verify/js/verify.min.js"></script>

    <script type="text/javascript">

        var entername="<s:text name='Enter_username'/>";

        var enterpass="<s:text name='Enter_password'/>";

@@ -124,7 +137,73 @@
            }, 1200);

            

            initDBpool();

            
            // 配置拖动验证图像

            $('#lVerify').slideVerify({

                type : 2,   //类型

                vOffset : 5,  //误差量，根据需求自行调整

                vSpace : 5, //间隔

                imgName : ['1.jpg', '2.jpg'],

                imgSize : {

                    width: '498px',

                    height: '250px',

                },

                blockSize : {

                    width: '40px',

                    height: '40px',

                },

                barSize : {

                    width : '498px',

                    height : '40px',

                },

                ready : function() {

    				
                },

                success : function() {

                    $('#lVerify-dialog').addClass('hdw-dialog-hide');    // 隐藏验证

                    checkuser();    // 验证用户

                },

                error : function() {

                    // alert('验证失败！');

                }

            });

        });

        
        // 初始化verify拖动验证

        function initVerify() {

            // 清空内容

            $('#lVerify').text('');

            // 配置拖动验证图像

            $('#lVerify').slideVerify({

                type : 2,   //类型

                vOffset : 5,  //误差量，根据需求自行调整

                vSpace : 5, //间隔

                imgName : ['1.jpg', '2.jpg'],

                imgSize : {

                    width: '498px',

                    height: '250px',

                },

                blockSize : {

                    width: '40px',

                    height: '40px',

                },

                barSize : {

                    width : '498px',

                    height : '40px',

                },

                ready : function() {

    				
                },

                success : function() {

                    $('#lVerify-dialog').addClass('hdw-dialog-hide');    // 隐藏验证

                    checkuser();    // 验证用户

                },

                error : function() {

                    // alert('验证失败！');

                }

            });

        }

        
        

        //初始化连接池

        function initDBpool(){

@@ -167,7 +246,8 @@
                $('#sub').children('.faa-spin').css('visibility', 'hidden');

                $('#sub').removeClass('page-loading');

            } else {

                checkuser();

                $('#lVerify-dialog').removeClass('hdw-dialog-hide');    // 显示拖动验证数据

                initVerify();

            }

        }



@@ -191,7 +271,7 @@
                        $('#sub').children('.faa-spin').css('visibility', 'hidden');

                        $('#sub').removeClass('page-loading');

                    } else {

                        window.location.href = data.msg;						
                        setNavSession(data.msg);

                    }

                }).error(function(){

                    noContent.showNoContent("登录失败请检查网络连接!");

@@ -237,18 +317,36 @@
            }

        });

        

        checkNavSession();

        // 设置导航数据

        function setNavSession(link) {

            $.ajax({

                url:'CustompageAction!searchAll',

                data: null,

                asnyc: true,

                dataType: 'json',

                success:function(res) {

                    console.log(res);

                    var rs = JSON.parse(res.result);

                    if(rs.code == 1) {

                        window.location.href = link;

                    }else {

						
                    }

					
                }

            });

        }

		
        //checkNavSession();

        // 监测导航数据的session

        function checkNavSession() {

        function checkNavSession(link) {

            $.ajax({

                url:'LoginAction!getSessionByString',

                data: 'json=custompages_json',

                asnyc: true,

                success:function(rs) {

                    if(rs.result == "") {

                        location.reload();

                    }

                    setTimeout(checkNavSession, 1500);

                    console.log(rs);

                    //window.location.href = link;

                }

            });

        }