m52mxtq3o
/
educoder
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

调整

Browse Source
dev_forum
杨树林 5 years ago
parent a4910c2f8f
commit f28a2e3580
6 changed files with 284 additions and 257 deletions
Show Stats Download Patch File Download Diff File

227
public/react/src/common/components/DragValidator.js
Unescape View File

@ -1,114 +1,115 @@
import React, { Component } from 'react';
const $ = window.jQuery
const jQuery = $;
if (!$.drag) {
(function($){
$.fn.dragValidator = function(options){
var x, drag = this, isMove = false, defaults = {
};
var options = $.extend(defaults, options);
//添加背景，文字，滑块
var html = '<div class="drag_bg"></div>'+
'<div class="drag_text" onselectstart="return false;" unselectable="on">拖动滑块验证</div>'+
'<div class="handler handler_bg"></div>';
this.append(html);
var handler = drag.find('.handler');
var drag_bg = drag.find('.drag_bg');
var text = drag.find('.drag_text');
var maxWidth = text.width() - handler.width(); //能滑动的最大间距
//鼠标按下时候的x轴的位置
handler.mousedown(function(e){
isMove = true;
x = e.pageX - parseInt(handler.css('left'), 10);
});
//鼠标指针在上下文移动时，移动距离大于0小于最大间距，滑块x轴位置等于鼠标移动距离
$(document).mousemove(function(e){
var _x = e.pageX - x;
var handler_offset = handler.offset();
var lastX = e.clientX -x;
lastX = Math.max(0,Math.min(maxWidth,lastX));
if(isMove){
if(_x > 0 && _x <= maxWidth){
handler.css({'left': lastX});
drag_bg.css({'width': lastX});
}
else if(lastX > maxWidth - 5 && lastX < maxWidth + 5 ){ //鼠标指针移动距离达到最大时清空事件
dragOk();
}
}
});
handler.mouseup(function(e){
isMove = false;
var _x = e.pageX - x;
if(text.text() != '验证通过' && _x < maxWidth){ //鼠标松开时，如果没有达到最大距离位置，滑块就返回初始位置
handler.animate({'left': 0});
drag_bg.animate({'width': 0});
}
});
//清空事件
function dragOk(){
options.dragOkCallback && options.dragOkCallback()
var kuaiwidth=drag.width() - handler.width() - 2;
handler.removeClass('handler_bg').addClass('handler_ok_bg');
handler.css({'left':kuaiwidth+'px'})
text.css({'width':kuaiwidth+'px'});
text.text('验证通过');
drag.css({'color': '#fff'});
drag_bg.css({'width':kuaiwidth+'px'})
handler.unbind('mousedown');
$(document).unbind('mousemove');
$(document).unbind('mouseup');
$("#user_verification_notice").html("");
$('#user_verification_notice').parent().hide();
}
};
})(jQuery);
}
class DragValidator extends Component {
componentDidMount () {
// if($("#reg-drag").length>0 && IsPC()){
$("#reg-drag").dragValidator({
height: this.props.height,
dragOkCallback: () => {
this.props.dragOkCallback && this.props.dragOkCallback()
}
});
// }else{
// $("#reg-drag").empty();
// }
}
empty() {
$("#reg-drag").empty();
}
render() {
const height = this.props.height || 45;
const className = this.props.className
const successGreenColor = this.props.successGreenColor || '#29bd8b'
// newMain clearfix
return (
<div id="reg-drag" className={`drag_slider ${className}`}>
<style>{`
.drag_slider .handler {
height: 100%;
}
.drag_slider {
height: ${height}px;
line-height: ${height}px;
}
.drag_slider .drag_bg {
height: ${height}px;
background-color: ${successGreenColor};
}
`}</style>
</div>
);
}
}
import React, { Component } from 'react';
const $ = window.jQuery
const jQuery = $;
if (!$.drag) {
(function($){
$.fn.dragValidator = function(options){
var x, drag = this, isMove = false, defaults = {
};
var options = $.extend(defaults, options);
//添加背景，文字，滑块
var html = '<div class="drag_bg"></div>'+
'<div class="drag_text" onselectstart="return false;" unselectable="on">拖动滑块验证</div>'+
'<div class="handler handler_bg"></div>';
this.append(html);
var handler = drag.find('.handler');
var drag_bg = drag.find('.drag_bg');
var text = drag.find('.drag_text');
var maxWidth = text.width() - handler.width(); //能滑动的最大间距
//鼠标按下时候的x轴的位置
handler.mousedown(function(e){
isMove = true;
x = e.pageX - parseInt(handler.css('left'), 10);
});
//鼠标指针在上下文移动时，移动距离大于0小于最大间距，滑块x轴位置等于鼠标移动距离
$(document).mousemove(function(e){
var _x = e.pageX - x;
var handler_offset = handler.offset();
var lastX = e.clientX -x;
lastX = Math.max(0,Math.min(maxWidth,lastX));
if(isMove){
if(_x > 0 && _x <= maxWidth){
handler.css({'left': lastX});
drag_bg.css({'width': lastX});
}
else if(lastX > maxWidth - 5 && lastX < maxWidth + 5 ){ //鼠标指针移动距离达到最大时清空事件
dragOk();
}
}
});
handler.mouseup(function(e){
isMove = false;
var _x = e.pageX - x;
if(text.text() != '验证通过' && _x < maxWidth){ //鼠标松开时，如果没有达到最大距离位置，滑块就返回初始位置
handler.animate({'left': 0});
drag_bg.animate({'width': 0});
}
});
//清空事件
function dragOk(){
options.dragOkCallback && options.dragOkCallback()
var kuaiwidth=drag.width() - handler.width() - 2;
handler.removeClass('handler_bg').addClass('handler_ok_bg');
handler.css({'left':kuaiwidth+'px'})
text.css({'width':kuaiwidth+'px'});
text.text('验证通过');
drag.css({'color': '#fff'});
drag_bg.css({'width':kuaiwidth+'px'})
handler.unbind('mousedown');
$(document).unbind('mousemove');
$(document).unbind('mouseup');
$("#user_verification_notice").html("");
$('#user_verification_notice').parent().hide();
}
};
})(jQuery);
}
class DragValidator extends Component {
componentDidMount () {
// if($("#reg-drag").length>0 && IsPC()){
$("#reg-drag").dragValidator({
height: this.props.height,
dragOkCallback: () => {
this.props.dragOkCallback && this.props.dragOkCallback()
}
});
// }else{
// $("#reg-drag").empty();
// }
}
empty() {
$("#reg-drag").empty();
}
render() {
const height = this.props.height || 45;
const className = this.props.className
const successGreenColor = this.props.successGreenColor || '#29bd8b'
// newMain clearfix
return (
<div id="reg-drag" style={{ width:"287px",}} className={`drag_slider ${className}`}>
<style>{`
.drag_slider .handler {
height: 100%;
}
.drag_slider {
height: ${height}px;
line-height: ${height}px;
}
.drag_slider .drag_bg {
height: ${height}px;
background-color: ${successGreenColor};
}
`}</style>
</div>
);
}
}
export default ( DragValidator );

114
public/react/src/common/components/DragValidatortwo.js
Unescape View File

@ -1,114 +0,0 @@
import React, { Component } from 'react';
const $ = window.jQuery
const jQuery = $;
if (!$.drag) {
(function($){
$.fn.dragValidator = function(options){
var x, drag = this, isMove = false, defaults = {
};
var options = $.extend(defaults, options);
//添加背景，文字，滑块
var html = '<div class="drag_bg"></div>'+
'<div class="drag_text" onselectstart="return false;" unselectable="on">拖动滑块验证</div>'+
'<div class="handler handler_bg"></div>';
this.append(html);
var handler = drag.find('.handler');
var drag_bg = drag.find('.drag_bg');
var text = drag.find('.drag_text');
var maxWidth = text.width() - handler.width(); //能滑动的最大间距
//鼠标按下时候的x轴的位置
handler.mousedown(function(e){
isMove = true;
x = e.pageX - parseInt(handler.css('left'), 10);
});
//鼠标指针在上下文移动时，移动距离大于0小于最大间距，滑块x轴位置等于鼠标移动距离
$(document).mousemove(function(e){
var _x = e.pageX - x;
var handler_offset = handler.offset();
var lastX = e.clientX -x;
lastX = Math.max(0,Math.min(maxWidth,lastX));
if(isMove){
if(_x > 0 && _x <= maxWidth){
handler.css({'left': lastX});
drag_bg.css({'width': lastX});
}
else if(lastX > maxWidth - 5 && lastX < maxWidth + 5 ){ //鼠标指针移动距离达到最大时清空事件
dragOk();
}
}
});
handler.mouseup(function(e){
isMove = false;
var _x = e.pageX - x;
if(text.text() != '验证通过' && _x < maxWidth){ //鼠标松开时，如果没有达到最大距离位置，滑块就返回初始位置
handler.animate({'left': 0});
drag_bg.animate({'width': 0});
}
});
//清空事件
function dragOk(){
options.dragOkCallback && options.dragOkCallback()
var kuaiwidth=drag.width() - handler.width() - 2;
handler.removeClass('handler_bg').addClass('handler_ok_bg');
handler.css({'left':kuaiwidth+'px'})
text.css({'width':kuaiwidth+'px'});
text.text('验证通过');
drag.css({'color': '#fff'});
drag_bg.css({'width':kuaiwidth+'px'})
handler.unbind('mousedown');
$(document).unbind('mousemove');
$(document).unbind('mouseup');
$("#user_verification_notice").html("");
$('#user_verification_notice').parent().hide();
}
};
})(jQuery);
}
class DragValidator extends Component {
componentDidMount () {
// if($("#reg-drag").length>0 && IsPC()){
$("#reg-drag").dragValidator({
height: this.props.height,
dragOkCallback: () => {
this.props.dragOkCallback && this.props.dragOkCallback()
}
});
// }else{
// $("#reg-drag").empty();
// }
}
empty() {
$("#reg-drag").empty();
}
render() {
const height = this.props.height || 45;
const className = this.props.className
const successGreenColor = this.props.successGreenColor || '#29bd8b'
// newMain clearfix
return (
<div id="reg-drag" className={`drag_slider ${className}`}>
<style>{`
.drag_slider .handler {
height: 100%;
}
.drag_slider {
height: ${height}px;
line-height: ${height}px;
}
.drag_slider .drag_bg {
height: ${height}px;
background-color: ${successGreenColor};
}
`}</style>
</div>
);
}
}
export default ( DragValidator );

104
public/react/src/modules/user/CheckInputysl.js
Unescape View File

@ -0,0 +1,104 @@
import React, { Component } from 'react';
import "./secureCode.css";
/**
* An TextInput with Icon and check
* 带图标检查的输入框
*/
class CheckInputysl extends Component {
constructor(){
super();
this.state = {
isMove:false,
start:0,
moveLength:0,
clear:false,
move:0,
width:0
};
this.onMouseUp = this.onMouseUp.bind(this);
this.onMouseDown = this.onMouseDown.bind(this);
this.onMouseMove = this.onMouseMove.bind(this);
}
componentDidMount() {
let dragHandler = document.getElementById("dragHandler");
dragHandler.addEventListener("mousedown", this.onMouseDown);
}
onMouseDown(e){
console.log("28");
document.addEventListener("mousemove", this.onMouseMove);
document.addEventListener("mouseup", this.onMouseUp);
let event=e||window.event;
this.setState({
isMove:true,
start:event.pageX
});
}
onMouseUp(e){
console.log("38");
let event=e||window.event;
this.setState({
isMove:false,
});
let drag = window.getComputedStyle(this.verifyDOM);
let handler = window.getComputedStyle(this.handlerDOM);
let moveLength = event.clientX-this.verifyDOM.offsetLeft - Number.parseInt(handler.width) / 2;
// console.log(drag.width);
let maxWidth = Number.parseInt(drag.width) - Number.parseInt(handler.width);
console.log("moveLength="+moveLength);
console.log("maxWidth="+maxWidth);
if(moveLength <= maxWidth){ //鼠标松开时，如果没有达到最大距离位置，滑块就返回初始位置
this.setState({
move:0,
width:0
});
document.removeEventListener("mousemove", this.onMouseMove);
document.removeEventListener("mouseup", this.onMouseUp);
}
if(this.props.onDrag){
this.props.onDrag(this.state.clear);
}
}
onMouseMove(e){
console.log("63");
let event=e||window.event;
let drag = window.getComputedStyle(this.verifyDOM);
let handler = window.getComputedStyle(this.handlerDOM);
let moveLength = event.clientX-this.verifyDOM.offsetLeft - Number.parseInt(handler.width) / 2;
let maxWidth = Number.parseInt(drag.width) - Number.parseInt(handler.width);
if(this.state.isMove){
if(moveLength<0){
moveLength=0
}else if(moveLength >= maxWidth){
moveLength=maxWidth;
this.removeMouseMove();
}
this.setState({
move:moveLength,
width:moveLength
});
}
}
//清空事件
removeMouseMove(){
this.setState({
clear:true
});
let dragHandler = document.getElementById("dragHandler");
dragHandler.removeEventListener("mousedown", this.onMouseDown);
document.removeEventListener("mousemove", this.onMouseMove);
document.removeEventListener("mouseup", this.onMouseUp);
this.props.dragOkCallback();
}
render(){
return (
<div id="drag" className="nl-drag-verify" ref={dom => {this.verifyDOM = dom}} style={{"color":this.state.clear ? "#fff" : "#252535"}}>
<div className="drag_bg" ref={dom => {this.bgDOM = dom}} style={{"width":this.state.width}}></div>
<div className="drag_text">{this.state.clear ? "验证通过" : "拖动滑块验证"}</div>
<div id="dragHandler" className={this.state.clear? "handler handler_ok_bg" : "handler handler_bg"} style={{"left":this.state.move}} ref={dom => {this.handlerDOM = dom}}></div>
</div>
);
}
}
export default ( CheckInputysl );

26
public/react/src/modules/user/FindPasswordComponent.js
Unescape View File

@ -2,11 +2,11 @@ import React, {Component} from 'react';
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
import {getImageUrl, DragValidator} from 'educoder';
import {getImageUrl} from 'educoder';
import CheckInputysl1 from './CheckInputysl';
import CheckInputysl2 from './CheckInputysl';
import {Tabs, Input, Checkbox, Button, notification} from 'antd';
import DragValidatortwo from '../../../src/common/components/DragValidatortwo'
import ReadPassword from './ReadPassword';
@ -643,24 +643,20 @@ class LoginRegisterComponent extends Component {
{
Whethertoverify===false&&pciphone===true?
<DragValidator
height={38} successGreenColor="#29bd8b"
style={{height: "38px", width: "100%"}}
dragOkCallback={()=>this.dragOkCallback()}
className="ysllw100"
></DragValidator>
<CheckInputysl1
dragOkCallback={this.dragOkCallback}
>
</CheckInputysl1>
:
""
}
{
Whethertoverify===true&&pciphone===true?
<DragValidatortwo
height={38} successGreenColor="#29bd8b"
style={{height: "38px", width: "100%"}}
dragOkCallback={()=>this.dragOkCallback()}
className="ysllw100"
></DragValidatortwo>
<CheckInputysl2
dragOkCallback={this.dragOkCallback}
>
</CheckInputysl2>
:
""
}

28
public/react/src/modules/user/LoginRegisterComponent.js
Unescape View File

@ -2,12 +2,13 @@ import React, {Component} from 'react';
import {BrowserRouter as Router, Route, Link, Switch} from "react-router-dom";
import {getImageUrl, DragValidator,broadcastChannelPostMessage} from 'educoder';
import {getImageUrl,broadcastChannelPostMessage} from 'educoder';
import {Tabs, Input, Checkbox, Button, notification,Menu} from 'antd';
import passopen from '../../../src/images/login/passopen.png';
import passoff from '../../../src/images/login/passoff.png';
import axios from 'axios';
import DragValidatortwo from '../../../src/common/components/DragValidatortwo'
import CheckInputysl1 from './CheckInputysl';
import CheckInputysl2 from './CheckInputysl';
import './common.css'
import './commontwo.css'
const { TabPane } = Tabs;
@ -402,7 +403,7 @@ class LoginRegisterComponent extends Component {
type: 1,
}
}).then((result) => {
debugger
//验证有问题{"status":1,"message":"success"}
// console.log(result);
// this.setState({dragOk: true})
@ -941,27 +942,24 @@ class LoginRegisterComponent extends Component {
}
{
Whethertoverify===false&&pciphone===true?
<DragValidator
height={38} successGreenColor="#29bd8b"
style={{ height: '38px',width: "100%"}}
dragOkCallback={this.dragOkCallback}
className="ysllw100"
></DragValidator>
<CheckInputysl1
dragOkCallback={this.dragOkCallback}
>
</CheckInputysl1>
:
""
}
{
Whethertoverify===true&&pciphone===true?
<DragValidatortwo
height={38} successGreenColor="#29bd8b"
style={{ height: '38px',width: "100%"}}
dragOkCallback={this.dragOkCallback}
className="ysllw100"
></DragValidatortwo>
<CheckInputysl2
dragOkCallback={this.dragOkCallback}
>
</CheckInputysl2>
:
""
}
<div>
{
pciphone===true?

42
public/react/src/modules/user/secureCode.css
Unescape View File

@ -0,0 +1,42 @@
#drag{
position: relative;
background-color: #e8e8e8;
min-width: 300px;
height: 38px;
line-height: 38px;
text-align: center;
}
#drag .handler{
position: absolute;
top: 0px;
left: 0px;
width: 40px;
height: 38px;
border: 1px solid #ccc;
cursor: move;
}
.handler_bg{ background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==") no-repeat center;}
.handler_ok_bg{ background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==") no-repeat center;}
#drag .drag_bg{
background-color: #7ac23c;
height: 38px;
width: 0px;
}
#drag .drag_text{
position: absolute;
top: 0px;
font-size: 14px;
width: 100%;
-moz-user-select: none;
-webkit-user-select: none;
color: #fff;
user-select: none;
-o-user-select:none;
-ms-user-select:none;
}
/* }*/
/*//.handler_bg{ background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTEyNTVEMURGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTEyNTVEMUNGMkVFMTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo2MTc5NzNmZS02OTQxLTQyOTYtYTIwNi02NDI2YTNkOWU5YmUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+YiRG4AAAALFJREFUeNpi/P//PwMlgImBQkA9A+bOnfsIiBOxKcInh+yCaCDuByoswaIOpxwjciACFegBqZ1AvBSIS5OTk/8TkmNEjwWgQiUgtQuIjwAxUF3yX3xyGIEIFLwHpKyAWB+I1xGSwxULIGf9A7mQkBwTlhBXAFLHgPgqEAcTkmNCU6AL9d8WII4HOvk3ITkWJAXWUMlOoGQHmsE45ViQ2KuBuASoYC4Wf+OUYxz6mQkgwAAN9mIrUReCXgAAAABJRU5ErkJggg==") no-repeat center;}*/
/*//.handler_ok_bg{ background: #fff url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDIxIDc5LjE1NTc3MiwgMjAxNC8wMS8xMy0xOTo0NDowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo0ZDhlNWY5My05NmI0LTRlNWQtOGFjYi03ZTY4OGYyMTU2ZTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDlBRDI3NjVGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDlBRDI3NjRGMkQ2MTFFNEI5NDBCMjQ2M0ExMDQ1OUYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDphNWEzMWNhMC1hYmViLTQxNWEtYTEwZS04Y2U5NzRlN2Q4YTEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NGQ4ZTVmOTMtOTZiNC00ZTVkLThhY2ItN2U2ODhmMjE1NmU2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+k+sHwwAAASZJREFUeNpi/P//PwMyKD8uZw+kUoDYEYgloMIvgHg/EM/ptHx0EFk9I8wAoEZ+IDUPiIMY8IN1QJwENOgj3ACo5gNAbMBAHLgAxA4gQ5igAnNJ0MwAVTsX7IKyY7L2UNuJAf+AmAmJ78AEDTBiwGYg5gbifCSxFCZoaBMCy4A4GOjnH0D6DpK4IxNSVIHAfSDOAeLraJrjgJp/AwPbHMhejiQnwYRmUzNQ4VQgDQqXK0ia/0I17wJiPmQNTNBEAgMlQIWiQA2vgWw7QppBekGxsAjIiEUSBNnsBDWEAY9mEFgMMgBk00E0iZtA7AHEctDQ58MRuA6wlLgGFMoMpIG1QFeGwAIxGZo8GUhIysmwQGSAZgwHaEZhICIzOaBkJkqyM0CAAQDGx279Jf50AAAAAABJRU5ErkJggg==") no-repeat center;}*/
Write Preview
Loading…
Cancel
Save