Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
wanjj_1210
ant-design
提交
a1d50301
A
ant-design
项目概览
wanjj_1210
/
ant-design
与 Fork 源项目一致
从无法访问的项目Fork
通知
10
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
A
ant-design
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
a1d50301
编写于
9月 11, 2015
作者:
A
afc163
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
rollback blur mask
上级
1f5cc32a
变更
4
隐藏空白更改
内联
并排
Showing
4 changed file
with
1 addition
and
108 deletion
+1
-108
components/modal/confirm.jsx
components/modal/confirm.jsx
+0
-33
components/modal/index.jsx
components/modal/index.jsx
+1
-34
style/core/motion.less
style/core/motion.less
+0
-1
style/core/motion/blur.less
style/core/motion/blur.less
+0
-40
未找到文件。
components/modal/confirm.jsx
浏览文件 @
a1d50301
import
React
from
'
react
'
;
import
Dialog
from
'
./index
'
;
let
div
;
let
cssAnimation
=
require
(
'
css-animation
'
);
export
default
function
(
props
)
{
let
d
;
props
=
props
||
{};
props
.
iconClassName
=
props
.
iconClassName
||
'
anticon-question-circle
'
;
props
.
bgAnimation
=
'
blur-enter blur-enter-active
'
;
let
width
=
props
.
width
||
416
;
// 默认为 true,保持向下兼容
...
...
@@ -15,37 +13,7 @@ export default function (props) {
props
.
okCancel
=
true
;
}
function
bgBlur
(
b
)
{
//增加背景模糊;
function
seeDom
(
callback
)
{
for
(
let
i
=
0
;
i
<
document
.
body
.
children
.
length
;
i
++
)
{
let
m
=
document
.
body
.
children
[
i
];
if
(
m
.
nodeName
!==
'
SCRIPT
'
&&
m
.
nodeName
!==
'
STYLE
'
&&
m
.
className
.
indexOf
(
'
ant-modal
'
)
<
0
)
{
callback
.
call
(
this
,
m
);
}
}
}
if
(
b
)
{
//cssAnimation(document.body, 'blur-enter')
seeDom
((
m
)
=>
{
m
.
className
+=
props
.
bgAnimation
;
});
}
else
{
seeDom
((
m
)
=>
{
let
rclass
=
/
[\t\r\n\f]
/g
;
let
_classname
=
(
'
'
+
m
.
className
+
'
'
).
replace
(
'
'
+
rclass
+
'
'
,
'
'
);
while
(
_classname
.
indexOf
(
props
.
bgAnimation
)
>=
0
)
{
_classname
=
_classname
.
replace
(
props
.
bgAnimation
,
'
'
);
}
m
.
className
=
_classname
.
trim
();
cssAnimation
(
m
,
'
blur-leave
'
);
});
}
}
function
close
()
{
bgBlur
(
false
);
d
.
setState
({
visible
:
false
});
...
...
@@ -116,7 +84,6 @@ export default function (props) {
div
=
document
.
createElement
(
'
div
'
);
document
.
body
.
appendChild
(
div
);
}
bgBlur
(
true
);
React
.
render
(<
Dialog
prefixCls
=
"ant-modal"
...
...
components/modal/index.jsx
浏览文件 @
a1d50301
...
...
@@ -3,8 +3,6 @@ import Dialog from 'rc-dialog';
import
{
Dom
}
from
'
rc-util
'
;
import
confirm
from
'
./confirm
'
;
let
cssAnimation
=
require
(
'
css-animation
'
);
function
noop
()
{
}
...
...
@@ -19,8 +17,7 @@ let AntModal = React.createClass({
onCancel
:
noop
,
width
:
520
,
transitionName
:
'
zoom
'
,
maskAnimation
:
'
fade
'
,
bgAnimation
:
'
blur-enter blur-enter-active
'
,
maskAnimation
:
'
fade
'
};
},
...
...
@@ -33,7 +30,6 @@ let AntModal = React.createClass({
handleCancel
()
{
this
.
props
.
onCancel
();
this
.
bgBlur
(
false
);
},
handleOk
()
{
...
...
@@ -42,34 +38,6 @@ let AntModal = React.createClass({
});
this
.
props
.
onOk
();
},
bgBlur
(
b
)
{
//增加背景模糊;
function
seeDom
(
callback
)
{
for
(
let
i
=
0
;
i
<
document
.
body
.
children
.
length
;
i
++
)
{
let
m
=
document
.
body
.
children
[
i
];
if
(
m
.
nodeName
!==
'
SCRIPT
'
&&
m
.
nodeName
!==
'
STYLE
'
&&
m
.
className
.
indexOf
(
'
ant-modal
'
)
<
0
)
{
callback
.
call
(
this
,
m
);
}
}
}
if
(
b
)
{
//cssAnimation(document.body, 'blur-enter')
seeDom
((
m
)
=>
{
m
.
className
+=
this
.
props
.
bgAnimation
;
});
}
else
{
seeDom
((
m
)
=>
{
let
rclass
=
/
[\t\r\n\f]
/g
;
let
_classname
=
(
'
'
+
m
.
className
+
'
'
).
replace
(
'
'
+
rclass
+
'
'
,
'
'
);
while
(
_classname
.
indexOf
(
this
.
props
.
bgAnimation
)
>=
0
)
{
_classname
=
_classname
.
replace
(
this
.
props
.
bgAnimation
,
'
'
);
}
m
.
className
=
_classname
.
trim
();
cssAnimation
(
m
,
'
blur-leave
'
);
});
}
},
componentWillReceiveProps
(
nextProps
)
{
if
(
'
visible
'
in
nextProps
)
{
...
...
@@ -81,7 +49,6 @@ let AntModal = React.createClass({
newState
.
confirmLoading
=
false
;
}
this
.
setState
(
newState
);
this
.
bgBlur
(
nextProps
.
visible
);
}
},
...
...
style/core/motion.less
浏览文件 @
a1d50301
...
...
@@ -29,4 +29,3 @@
@import "motion/slide";
@import "motion/swing";
@import "motion/zoom";
@import "motion/blur";
style/core/motion/blur.less
已删除
100644 → 0
浏览文件 @
1f5cc32a
.blur-enter, .blur-appear {
.motion-common();
animation-timing-function: @ease-in-out;
animation-play-state: paused;
}
.blur-leave {
filter:blur(4px);
.motion-common();
animation-timing-function: @ease-in-out;
animation-play-state: paused;
}
.blur-enter.blur-enter-active, .blur-appear.blur-appear-active {
animation-name: blurIn;
animation-play-state: running;
}
.blur-leave.blur-leave-active {
animation-name: blurOut;
animation-play-state: running;
}
@keyframes blurIn {
0% {
filter: blur(0);
}
100% {
filter: blur(4px);
}
}
@keyframes blurOut {
0% {
filter: blur(4px);
}
100% {
filter: blur(0);
}
}
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录