實現乙個水平垂直居中的淡入淡出提示框

2021-10-08 12:43:31 字數 1151 閱讀 9400

面試中遇到的問題,沒答上來,虐哭了,直接貼上**,可直接複製執行

<

!doctype html>

"en" dir=

"ltr"

>

"utf-8"

>

toast<

/title>

<

/head>

"screen"

>

/* 出現時的漸變 */

@keyframes fadein

100%

}/* 表示不同的核心 */

@-webkit-keyframes fadein

100%

} @-moz-keyframes fadein

100%

} @-o-keyframes fadein

100%

} @-ms-keyframes fadein

100%

}/* 淡出的漸變 */

@keyframes fadeout

100%

} @-webkit-keyframes fadeout

100%

} @-moz-keyframes fadeout

100%

} @-o-keyframes fadeout

100%

} @-ms-keyframes fadeout

100%

}/* 框的樣式 */

#toast

.hide

.fadeout

.fadein

<

/style>

<

/body>

<

/html>

vartoast

=function

(params));

},params.time);}

;//使用

toast()

;/*------------------------

author:codetnt

date:2018/7/13

-------------------------*/

<

/script>

結合彈出層:

javascript原生封裝乙個淡入淡出效果的函式

說到js的漸變顯示與消失,多數朋友會想到jquery裡面的fadein fadeout 或fadetoggle 但如果僅僅是為了引入這樣的乙個效果,而去呼叫了龐大jquery庫?或者說我通過用原生js實現一些函式來提高自己 所以,我簡單的研究了一下純js 寫淡入淡出的效果。author thomas...

視窗淡入淡出效果的實現

1.簡介 函式 setlayeredwindowattributes header declared in winuser.h,include windows.h import library user32.lib minimum operating systems windows 2000 所以在...

視窗淡入淡出效果的實現

1.簡介 函式 setlayeredwindowattributes header declared in winuser.h,include windows.h import library user32.lib minimum operating systems windows 2000 所以在...