IT博客汇
  • 首页
  • 精华
  • 技术
  • 设计
  • 资讯
  • 扯淡
  • 权利声明
  • 登录 注册

    html5圆形进度条加载按钮效果

    天外飞仙发表于 2015-09-10 12:00:07
    love 0

    html5圆形进度条加载按钮效果
    20150830140453

    <script type="text/javascript" src="js/classie.js"></script>
    <script type="text/javascript" src="js/uiProgressButton.js"></script>
    <script type="text/javascript">
    [].slice.call( document.querySelectorAll( '.progress-button' ) ).forEach( function( bttn, pos ) {
    	new UIProgressButton( bttn, {
    		callback : function( instance ) {
    			var progress = 0,
    				interval = setInterval( function() {
    					progress = Math.min( progress + Math.random() * 0.1, 1 );
    					instance.setProgress( progress );
    
    					if( progress === 1 ) {
    						instance.stop( pos === 1 || pos === 3 ? -1 : 1 );
    						clearInterval( interval );
    					}
    				}, 150 );
    		}
    	} );
    } );
    </script>
    

    下载地址
    预览地址



沪ICP备19023445号-2号
友情链接