I admit THAT I am very dish, but fortunately I like to see other people’s source code, read after I also like to share it out, to you also have a look, don’t think I am great, in fact I am so great (f * * k, also write not to write), well, let’s start.

Effect preview:

\

This is to use ali cloud components to do, the source code is like this:

<! DOCTYPEhtml>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="Width =device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
    <! -- Domestic use -->
    <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/nch5/index.js?t=2015052012"></script>
    <! If your main users are from overseas, please use the following JS resources instead -->
    <! -- <script type="text/javascript" charset="utf-8" src="//aeis.alicdn.com/sd/nch5/index.js?t=2015052012"></script> -->
</head>
<body>
    <div id="__nc" style="margin-left:auto; margin-right:auto; width:30%; height:100px; padding-top:100px;">
        <div id="nc"></div>
    </div>
    <script>  
    var nc_token = ["CF_APP_1", (new Date()).getTime(), Math.random()].join(':');
    var nc=NoCaptcha.init({
        renderTo: '#nc'.// Declare the ID of the target element to be rendered for sliding validation
        appkey: 'CF_APP_1'.scene: 'register'.token: nc_token,     
        trans: {"key1": "code200"},
        elementID: ["usernameID"].is_Opt: 0.language: "cn".timeout: 10000.retryTimes: 5.errorTimes: 5.inline:false.apimap: {
            // 'analyze': '//a.com/nocaptcha/analyze.jsonp',
            // 'uab_Url': '//aeu.alicdn.com/js/uac/909.js',
        },
        bannerHidden:false.initHidden:false.callback: function (data) {
            window.console && console.log(nc_token)
            window.console && console.log(data.csessionid)
            window.console && console.log(data.sig)
        },
        error: function (s) {}}); NoCaptcha.setEnabled(true);
    nc.reset();// Be sure to call the reset() method once
    NoCaptcha.upLang('cn', {
        'LOADING':"Loading..."./ / load
        'SLIDER_LABEL': "Please swipe right to verify.".// Wait for the slide
        'CHECK_Y':"Verified"./ / by
        'ERROR_TITLE':"I'm very sorry, this is a mistake..."./ / intercept
        'CHECK_N':"Verification failed".// Prepare to wake up secondary validation
        'OVERLAY_INFORM':"Risk detected in your current operating environment, please enter the verification code.".// Double check
        'TIPS_TITLE':"Verification code error, please re-enter"// The verification code is incorrectly entered
    });
    </script>
</body>
</html>
Copy the code

Ps: this code can be used directly, but some say, want to inside js, very simple, check the web source code can, the latter you are very lazy, also line, here is JS: click download

Is the brain buzzing, I saw the first time also, slowly look.

\