web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置:
首页
>
网页特效
>
图像/媒体
带动画图标的jquery按钮插件
分类:
图像/媒体
日期:
2024-05-14
点击(2)
评论(0)
演 示
免费下载
简介
在页面中引入magicBtn.css和jquery以及magicBtn.js文件。 ```html
``` ##### HTML结构 然后在页面中添加按钮元素: ```html
按钮
``` ##### 初始化插件 在页面DOM元素加载完毕之后,通过下面的方法来初始化该Jquery按钮插件。 ```html $.magicBtn(selector,options); ``` ##### 配置参数 可用的配置参数有: ```html options = { buttonType: 'type', // 'material','outline' rounded: false, // (bool) - add class '.round', border-radius: 5px fill: false // Just for 'outline', fill effect on button:hover } ``` ##### 方法 该jquery按钮插件的可用方法有: 1、loading加载方法 ```html var options = { loadginText: 'Your loading text', loadingIcon: bool(true), icon: '
' } $('#selector').startLoading(options); ``` 初始文本作为一个属性保存在按钮的HTML标签上: ```html
$text
。 ``` 如果设置了图标,那么文字参数不会起作用。 2、返回结构状态 ```html var options = { initialText: data-initial-text status: '',//One of success, warning, error. Empty for default. } $('#selector').resultLoading(options); ``` 可以有四种类型的返回状态: 1、成功状态 2、警告状态 3、错误状态 4、默认状态 3、移除loading ```html var options = { text: 'Your custom text for the button' } $('#selector').removeLoading(options); ``` 4、Disabled状态 ```html var options = {} $('#selector').disabled(options); ``` 5、块级按钮 ```html
``` 6、图标旋转 ```html $(selector).startLoading({ 'icon': '
' }) ```
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告