c006/yii2-submit-spinner

在提交时添加一个带有旋转加载器的div覆盖层

安装数: 8,464

依赖项: 0

建议者: 0

安全性: 0

星标: 6

关注者: 2

分支: 5

开放问题: 0

类型:yii2-extension

v2.0 2017-09-19 22:07 UTC

This package is not auto-updated.

Last update: 2024-09-14 16:06:24 UTC


README

当前版本 1.1.0

  • 新增插件,form_validate

安装

安装此扩展的首选方式是通过 composer

运行以下命令之一:

php composer.phar require --prefer-source "c006/yii2-submit-spinner" "dev-master"

或在您的 composer.json 文件的 require 部分添加:

"c006/yii2-submit-spinner": "dev-master"

到 require 部分。

所需

  • jQuery

  • yii \ widgets \ ActiveForm

选项

class_id => {string}
容器的ID。默认: "SubmitSpinner"

form_id => {string}
表单的ID

bg_color => {string}
覆盖层的颜色

bg_opacity => {float}
覆盖层的透明度

spin_speed => {int}
完成360度旋转所需秒数

radius => {int}
旋转器的像素半径/宽度

bg_spinner_opacity => {float}
主要旋转器的透明度

bg_spinner_color => {string}
主要旋转器的颜色

sections => {int}
点的数量或圆的数量

section_size => {int}
点/圆的像素大小

section_color => {string}
点/圆的颜色

section_offset => {int}
从中心到px的距离

section_opacity_base => {float}
最小透明度,例如0.25

proportionate_increase => {boolean}
根据主要旋转器成比例增加/减少点

form_validate => {boolean}
在成功的 ActiveForm 验证时触发

演示

演示:http://demo.c006.us

用法

添加javascript函数

  • show_submit_spinner()

  • hide_submit_spinner()

扩展安装后,只需在代码中

默认选项

<?= \c006\spinner\SubmitSpinner::widget(); ?>

所有选项: (使用默认值)

<?=
    c006\spinner\SubmitSpinner::widget(
                           [
                               'form_id'                => $form->id,
                               'bg_color'               => '#444444',
                               'bg_opacity'             => 0.8,
                               'spin_speed'             => 4,
                               'radius'                 => 200,
                               'bg_spinner_opacity'     => 0.5,
                               'bg_spinner_color'       => '#000000',
                               'sections'               => 15,
                               'section_size'           => 20,
                               'section_color'          => '#FFFFFF',
                               'section_offset'         => 80,
                               'section_opacity_base'   => .2,
                               'proportionate_increase' => 1,
                           ]
    ) ?>

所有选项: (只有5个大型点,没有背景旋转器)

<?= c006\spinner\SubmitSpinner::widget(
                              [
                                  'form_id'                => $form->id,
                                  'bg_color'               => '#333333',
                                  'bg_opacity'             => 0.8,
                                  'spin_speed'             => 4,
                                  'radius'                 => 250,
                                  'bg_spinner_opacity'     => 0.0,
                                  'bg_spinner_color'       => '#000000',
                                  'sections'               => 5,
                                  'section_size'           => 80,
                                  'section_color'          => '#FFFFFF',
                                  'section_offset'         => 80,
                                  'section_opacity_base'   => .2,
                                  'proportionate_increase' => 0,
                              ]
       ) ?>

评论/建议

请提供任何有价值的反馈或请求。

谢谢。