hexo博客添加弹窗公告
新建
/css/gg.css
,在css中引入以下代码:(只推荐新建,不推荐粘贴到已有的CSS中)1
2
3
4
5
6
7
8
9.sweet-alert,.sweet-overlay{position:fixed;display:none}body.stop-scrolling{height:100%;overflow:hidden}.sweet-overlay{background-color:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";background-color:rgba(0,0,0,.4);left:0;right:0;top:0;bottom:0;z-index:10000}.sweet-alert{background-color:#fff;font-family:'Open Sans','Helvetica Neue',Helvetica,Arial,sans-serif;width:478px;padding:17px;border-radius:5px;text-align:center;left:50%;top:50%;margin-left:-256px;margin-top:-200px;overflow:hidden;z-index:99999}@media all and (max-width:540px){.sweet-alert{width:auto;margin-left:0;margin-right:0;left:15px;right:15px}}.sweet-alert h2{color:#575757;font-size:30px;text-align:center;font-weight:600;text-transform:none;position:relative;margin:25px 0;padding:0;line-height:40px;display:block}.sweet-alert p{color:#797979;font-size:16px;font-weight:300;position:relative;text-align:inherit;float:none;margin:0;padding:0;line-height:normal}.sweet-alert fieldset{border:none;position:relative}.sweet-alert .sa-error-container{background-color:#f1f1f1;margin-left:-17px;margin-right:-17px;overflow:hidden;padding:0 10px;max-height:0;webkit-transition:padding .15s,max-height .15s;transition:padding .15s,max-height .15s}.sweet-alert .sa-error-container.show{padding:10px 0;max-height:100px;webkit-transition:padding .2s,max-height .2s;transition:padding .25s,max-height .25s}.sweet-alert .sa-error-container .icon{display:inline-block;width:24px;height:24px;border-radius:50%;background-color:#ea7d7d;color:#fff;line-height:24px;text-align:center;margin-right:3px}.sweet-alert .sa-error-container p{display:inline-block}.sweet-alert .sa-input-error{position:absolute;top:29px;right:26px;width:20px;height:20px;opacity:0;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:50% 50%;transform-origin:50% 50%;-webkit-transition:all .1s;transition:all .1s}.sweet-alert .sa-input-error::after,.sweet-alert .sa-input-error::before{content:"";width:20px;height:6px;background-color:#f06e57;border-radius:3px;position:absolute;top:50%;margin-top:-4px;left:50%;margin-left:-9px}.sweet-alert .sa-input-error::before{-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-input-error::after{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .sa-input-error.show{opacity:1;-webkit-transform:scale(1);transform:scale(1)}.sweet-alert input{width:100%;box-sizing:border-box;border-radius:3px;border:1px solid #d7d7d7;height:43px;margin-top:10px;margin-bottom:17px;font-size:18px;box-shadow:inset 0 1px 1px rgba(0,0,0,.06);padding:0 12px;display:none;-webkit-transition:all .3s;transition:all .3s}.sweet-alert input:focus{outline:0;box-shadow:0 0 3px #c4e6f5;border:1px solid #b4dbed}.sweet-alert input:focus::-moz-placeholder{transition:opacity .3s 30ms ease;opacity:.5}.sweet-alert input:focus:-ms-input-placeholder{transition:opacity .3s 30ms ease;opacity:.5}.sweet-alert input:focus::-webkit-input-placeholder{transition:opacity .3s 30ms ease;opacity:.5}.sweet-alert input::-moz-placeholder{color:#bdbdbd}.sweet-alert input:-ms-input-placeholder{color:#bdbdbd}.sweet-alert input::-webkit-input-placeholder{color:#bdbdbd}.sweet-alert.show-input input{display:block}.sweet-alert .sa-confirm-button-container{display:inline-block;position:relative}.sweet-alert .la-ball-fall{position:absolute;left:50%;top:50%;margin-left:-27px;margin-top:4px;opacity:0;visibility:hidden}.sweet-alert button{background-color:#8CD4F5;color:#fff;border:none;box-shadow:none;font-size:17px;font-weight:500;-webkit-border-radius:4px;border-radius:5px;padding:10px 32px;margin:26px 5px 0;cursor:pointer}.sweet-alert button:focus{outline:0;box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)}.sweet-alert button:hover{background-color:#7ecff4}.sweet-alert button:active{background-color:#5dc2f1}.sweet-alert button.cancel{background-color:#C1C1C1}.sweet-alert button.cancel:hover{background-color:#b9b9b9}.sweet-alert button.cancel:active{background-color:#a8a8a8}.sweet-alert button.cancel:focus{box-shadow:rgba(197,205,211,.8) 0 0 2px,rgba(0,0,0,.0470588) 0 0 0 1px inset }.sweet-alert button[disabled]{opacity:.6;cursor:default}.sweet-alert button.confirm[disabled]{color:transparent}.sweet-alert button.confirm[disabled]~.la-ball-fall{opacity:1;visibility:visible;transition-delay:0s}.sweet-alert button::-moz-focus-inner{border:0}.sweet-alert[data-has-cancel-button=false] button{box-shadow:none }.sweet-alert[data-has-confirm-button=false][data-has-cancel-button=false]{padding-bottom:40px}.sweet-alert .sa-icon{width:80px;height:80px;border:4px solid gray;-webkit-border-radius:40px;border-radius:50%;margin:20px auto;padding:0;position:relative;box-sizing:content-box}.sweet-alert .sa-icon.sa-error{border-color:#F27474}.sweet-alert .sa-icon.sa-error .sa-x-mark{position:relative;display:block}.sweet-alert .sa-icon.sa-error .sa-line{position:absolute;height:5px;width:47px;background-color:#F27474;display:block;top:37px;border-radius:2px}.sweet-alert .sa-icon.sa-error .sa-line.sa-left{-webkit-transform:rotate(45deg);transform:rotate(45deg);left:17px}.sweet-alert .sa-icon.sa-error .sa-line.sa-right{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:16px}.sweet-alert .sa-icon.sa-warning{border-color:#F8BB86}.sweet-alert .sa-icon.sa-warning .sa-body{position:absolute;width:5px;height:47px;left:50%;top:10px;-webkit-border-radius:2px;border-radius:2px;margin-left:-2px;background-color:#F8BB86}.sweet-alert .sa-icon.sa-warning .sa-dot{position:absolute;width:7px;height:7px;-webkit-border-radius:50%;border-radius:50%;margin-left:-3px;left:50%;bottom:10px;background-color:#F8BB86}.sweet-alert .sa-icon.sa-info::after,.sweet-alert .sa-icon.sa-info::before{content:"";background-color:#C9DAE1;position:absolute}.sweet-alert .sa-icon.sa-info{border-color:#C9DAE1}.sweet-alert .sa-icon.sa-info::before{width:5px;height:29px;left:50%;bottom:17px;border-radius:2px;margin-left:-2px}.sweet-alert .sa-icon.sa-info::after{width:7px;height:7px;border-radius:50%;margin-left:-3px;top:19px}.sweet-alert .sa-icon.sa-success{border-color:#A5DC86}.sweet-alert .sa-icon.sa-success::after,.sweet-alert .sa-icon.sa-success::before{content:'';position:absolute;width:60px;height:120px;background:#fff}.sweet-alert .sa-icon.sa-success::before{-webkit-border-radius:120px 0 0 120px;border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;transform-origin:60px 60px}.sweet-alert .sa-icon.sa-success::after{-webkit-border-radius:0 120px 120px 0;border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 60px;transform-origin:0 60px}.sweet-alert .sa-icon.sa-success .sa-placeholder{width:80px;height:80px;border:4px solid rgba(165,220,134,.2);-webkit-border-radius:40px;border-radius:50%;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2}.sweet-alert .sa-icon.sa-success .sa-fix{width:5px;height:90px;background-color:#fff;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-icon.sa-success .sa-line{height:5px;background-color:#A5DC86;display:block;border-radius:2px;position:absolute;z-index:2}.sweet-alert .sa-icon.sa-success .sa-line.sa-tip{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .sa-icon.sa-success .sa-line.sa-long{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .sa-icon.sa-custom{background-size:contain;border-radius:0;border:none;background-position:center center;background-repeat:no-repeat}@-webkit-keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-transform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-transform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-webkit-keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@-webkit-keyframes slideFromTop{0%{top:0}100%{top:50%}}@keyframes slideFromTop{0%{top:0}100%{top:50%}}@-webkit-keyframes slideToTop{0%{top:50%}100%{top:0}}@keyframes slideToTop{0%{top:50%}100%{top:0}}@-webkit-keyframes slideFromBottom{0%{top:70%}100%{top:50%}}@keyframes slideFromBottom{0%{top:70%}100%{top:50%}}@-webkit-keyframes slideToBottom{0%{top:50%}100%{top:70%}}@keyframes slideToBottom{0%{top:50%}100%{top:70%}}.showSweetAlert[data-animation=pop]{-webkit-animation:showSweetAlert .3s;animation:showSweetAlert .3s}.showSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}.showSweetAlert[data-animation=slide-from-top]{-webkit-animation:slideFromTop .3s;animation:slideFromTop .3s}.showSweetAlert[data-animation=slide-from-bottom]{-webkit-animation:slideFromBottom .3s;animation:slideFromBottom .3s}.hideSweetAlert[data-animation=pop]{-webkit-animation:hideSweetAlert .2s;animation:hideSweetAlert .2s}.hideSweetAlert[data-animation=none]{-webkit-animation:none;animation:none}.hideSweetAlert[data-animation=slide-from-top]{-webkit-animation:slideToTop .4s;animation:slideToTop .4s}.hideSweetAlert[data-animation=slide-from-bottom]{-webkit-animation:slideToBottom .3s;animation:slideToBottom .3s}@-webkit-keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-webkit-keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-webkit-keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}@keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}.animateSuccessTip{-webkit-animation:animateSuccessTip .75s;animation:animateSuccessTip .75s}.animateSuccessLong{-webkit-animation:animateSuccessLong .75s;animation:animateSuccessLong .75s}.sa-icon.sa-success.animate::after{-webkit-animation:rotatePlaceholder 4.25s ease-in;animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);-webkit-transform:rotateX(0);opacity:1}}@keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);-webkit-transform:rotateX(0);opacity:1}}.animateErrorIcon{-webkit-animation:animateErrorIcon .5s;animation:animateErrorIcon .5s}@-webkit-keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}@keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}.animateXMark{-webkit-animation:animateXMark .5s;animation:animateXMark .5s}@-webkit-keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}@keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}.pulseWarning{-webkit-animation:pulseWarning .75s infinite alternate;animation:pulseWarning .75s infinite alternate}@-webkit-keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}@keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}.pulseWarningIns{-webkit-animation:pulseWarningIns .75s infinite alternate;animation:pulseWarningIns .75s infinite alternate}@-webkit-keyframes rotate-loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes rotate-loading{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.sweet-alert .sa-icon.sa-error .sa-line.sa-left{-ms-transform:rotate(45deg)\9}.sweet-alert .sa-icon.sa-error .sa-line.sa-right{-ms-transform:rotate(-45deg)\9}.sweet-alert .sa-icon.sa-success{border-color:transparent\9}.sweet-alert .sa-icon.sa-success .sa-line.sa-tip{-ms-transform:rotate(45deg)\9}.sweet-alert .sa-icon.sa-success .sa-line.sa-long{-ms-transform:rotate(-45deg)\9}/*!
* Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
* Copyright 2015 Daniel Cardoso <@DanielCardoso>
* Licensed under MIT
*/.la-ball-fall,.la-ball-fall>div{position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.la-ball-fall{display:block;font-size:0;color:#fff;width:54px;height:18px}.la-ball-fall.la-dark{color:#333}.la-ball-fall>div{display:inline-block;float:none;background-color:currentColor;border:0 solid currentColor;width:10px;height:10px;margin:4px;border-radius:100%;opacity:0;-webkit-animation:ball-fall 1s ease-in-out infinite;-moz-animation:ball-fall 1s ease-in-out infinite;-o-animation:ball-fall 1s ease-in-out infinite;animation:ball-fall 1s ease-in-out infinite}.la-ball-fall>div:nth-child(1){-webkit-animation-delay:-.2s;-moz-animation-delay:-.2s;-o-animation-delay:-.2s;animation-delay:-.2s}.la-ball-fall>div:nth-child(2){-webkit-animation-delay:-.1s;-moz-animation-delay:-.1s;-o-animation-delay:-.1s;animation-delay:-.1s}.la-ball-fall>div:nth-child(3){-webkit-animation-delay:0s;-moz-animation-delay:0s;-o-animation-delay:0s;animation-delay:0s}.la-ball-fall.la-sm{width:26px;height:8px}.la-ball-fall.la-sm>div{width:4px;height:4px;margin:2px}.la-ball-fall.la-2x{width:108px;height:36px}.la-ball-fall.la-2x>div{width:20px;height:20px;margin:8px}.la-ball-fall.la-3x{width:162px;height:54px}.la-ball-fall.la-3x>div{width:30px;height:30px;margin:12px}@-webkit-keyframes ball-fall{0%{opacity:0;-webkit-transform:translateY(-145%);transform:translateY(-145%)}10%,90%{opacity:.5}20%,80%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(145%);transform:translateY(145%)}}@-moz-keyframes ball-fall{0%{opacity:0;-moz-transform:translateY(-145%);transform:translateY(-145%)}10%,90%{opacity:.5}20%,80%{opacity:1;-moz-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-moz-transform:translateY(145%);transform:translateY(145%)}}@-o-keyframes ball-fall{0%{opacity:0;-o-transform:translateY(-145%);transform:translateY(-145%)}10%,90%{opacity:.5}20%,80%{opacity:1;-o-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-o-transform:translateY(145%);transform:translateY(145%)}}@keyframes ball-fall{0%{opacity:0;-webkit-transform:translateY(-145%);-moz-transform:translateY(-145%);-o-transform:translateY(-145%);transform:translateY(-145%)}10%,90%{opacity:.5}20%,80%{opacity:1;-webkit-transform:translateY(0);-moz-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(145%);-moz-transform:translateY(145%);-o-transform:translateY(145%);transform:translateY(145%)}}新建
/js/gg.js
并加入以下代码:1
!function(w,C,S){"use strict";!function o(a,r,s){function l(n,e){if(!r[n]){if(!a[n]){var t="function"==typeof require&&require;if(!e&&t)return t(n,!0);if(i)return i(n,!0);e=new Error("Cannot find module '"+n+"'");throw e.code="MODULE_NOT_FOUND",e}t=r[n]={exports:{}};a[n][0].call(t.exports,function(e){var t=a[n][1][e];return l(t||e)},t,t.exports,o,a,r,s)}return r[n].exports}for(var i="function"==typeof require&&require,e=0;e<s.length;e++)l(s[e]);return l}({1:[function(e,t,n){function o(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(n,"__esModule",{value:!0});var c,d,a,f,p=e("./modules/handle-dom"),m=e("./modules/utils"),y=e("./modules/handle-swal-dom"),v=e("./modules/handle-click"),h=o(e("./modules/handle-key")),b=o(e("./modules/default-params")),g=o(e("./modules/set-params"));n.default=a=f=function(){var t=arguments[0];function e(e){return(t[e]===S?b.default:t)[e]}if(p.addClass(C.body,"stop-scrolling"),y.resetInput(),t===S)return m.logStr("SweetAlert expects at least 1 attribute!"),!1;var n=m.extend({},b.default);switch(typeof t){case"string":n.title=t,n.text=arguments[1]||"",n.type=arguments[2]||"";break;case"object":if(t.title===S)return m.logStr('Missing "title" argument!'),!1;for(var o in n.title=t.title,b.default)n[o]=e(o);n.confirmButtonText=n.showCancelButton?"Confirm":b.default.confirmButtonText,n.confirmButtonText=e("confirmButtonText"),n.doneFunction=arguments[1]||null;break;default:return m.logStr('Unexpected type of argument! Expected "string" or "object", got '+typeof t),!1}g.default(n),y.fixVerticalPosition(),y.openModal(arguments[1]);for(var a=y.getModal(),r=a.querySelectorAll("button"),s=["onclick","onmouseover","onmouseout","onmousedown","onmouseup","onfocus"],l=function(e){return v.handleButton(e,n,a)},i=0;i<r.length;i++)for(var u=0;u<s.length;u++)r[i][s[u]]=l;y.getOverlay().onclick=l,c=w.onkeydown;w.onkeydown=function(e){return h.default(e,n,a)},w.onfocus=function(){setTimeout(function(){d!==S&&(d.focus(),d=S)},0)},f.enableButtons()},a.setDefaults=f.setDefaults=function(e){if(!e)throw new Error("userParams is required");if("object"!=typeof e)throw new Error("userParams has to be a object");m.extend(b.default,e)},a.close=f.close=function(){var t=y.getModal(),e=(p.fadeOut(y.getOverlay(),5),p.fadeOut(t,5),p.removeClass(t,"showSweetAlert"),p.addClass(t,"hideSweetAlert"),p.removeClass(t,"visible"),t.querySelector(".sa-icon.sa-success")),e=(p.removeClass(e,"animate"),p.removeClass(e.querySelector(".sa-tip"),"animateSuccessTip"),p.removeClass(e.querySelector(".sa-long"),"animateSuccessLong"),t.querySelector(".sa-icon.sa-error")),e=(p.removeClass(e,"animateErrorIcon"),p.removeClass(e.querySelector(".sa-x-mark"),"animateXMark"),t.querySelector(".sa-icon.sa-warning"));return p.removeClass(e,"pulseWarning"),p.removeClass(e.querySelector(".sa-body"),"pulseWarningIns"),p.removeClass(e.querySelector(".sa-dot"),"pulseWarningIns"),setTimeout(function(){var e=t.getAttribute("data-custom-class");p.removeClass(t,e)},300),p.removeClass(C.body,"stop-scrolling"),w.onkeydown=c,w.previousActiveElement&&w.previousActiveElement.focus(),d=S,clearTimeout(t.timeout),!0},a.showInputError=f.showInputError=function(e){var t=y.getModal(),n=t.querySelector(".sa-input-error"),n=(p.addClass(n,"show"),t.querySelector(".sa-error-container"));p.addClass(n,"show"),n.querySelector("p").innerHTML=e,setTimeout(function(){a.enableButtons()},1),t.querySelector("input").focus()},a.resetInputError=f.resetInputError=function(e){if(e&&13===e.keyCode)return!1;var e=y.getModal(),t=e.querySelector(".sa-input-error"),t=(p.removeClass(t,"show"),e.querySelector(".sa-error-container"));p.removeClass(t,"show")},a.disableButtons=f.disableButtons=function(e){var t=y.getModal(),n=t.querySelector("button.confirm"),t=t.querySelector("button.cancel");n.disabled=!0,t.disabled=!0},a.enableButtons=f.enableButtons=function(e){var t=y.getModal(),n=t.querySelector("button.confirm"),t=t.querySelector("button.cancel");n.disabled=!1,t.disabled=!1},void 0!==w?w.sweetAlert=w.swal=a:m.logStr("SweetAlert is a frontend module!"),t.exports=n.default},{"./modules/default-params":2,"./modules/handle-click":3,"./modules/handle-dom":4,"./modules/handle-key":5,"./modules/handle-swal-dom":6,"./modules/set-params":8,"./modules/utils":9}],2:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});n.default={title:"",text:"",type:null,allowOutsideClick:!1,showConfirmButton:!0,showCancelButton:!1,closeOnConfirm:!0,closeOnCancel:!0,confirmButtonText:"OK",confirmButtonColor:"#8CD4F5",cancelButtonText:"Cancel",imageUrl:null,imageSize:null,timer:null,customClass:"",html:!1,animation:!0,allowEscapeKey:!0,inputType:"text",inputPlaceholder:"",inputValue:"",showLoaderOnConfirm:!1},t.exports=n.default},{}],3:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});function m(e,t){var n=!0;h.hasClass(e,"show-input")&&(n=(n=e.querySelector("input").value)||""),t.doneFunction(n),t.closeOnConfirm&&sweetAlert.close(),t.showLoaderOnConfirm&&sweetAlert.disableButtons()}function y(e,t){var n=String(t.doneFunction).replace(/\s/g,"");"function("===n.substring(0,9)&&")"!==n.substring(9,10)&&t.doneFunction(!1),t.closeOnCancel&&sweetAlert.close()}var v=e("./utils"),h=(e("./handle-swal-dom"),e("./handle-dom"));n.default={handleButton:function(e,t,n){var o,a,r,e=e||w.event,s=e.target||e.srcElement,l=-1!==s.className.indexOf("confirm"),i=-1!==s.className.indexOf("sweet-overlay"),u=h.hasClass(n,"visible"),c=t.doneFunction&&"true"===n.getAttribute("data-has-done-function");function d(e){l&&t.confirmButtonColor&&(s.style.backgroundColor=e)}switch(l&&t.confirmButtonColor&&(o=t.confirmButtonColor,a=v.colorLuminance(o,-.04),r=v.colorLuminance(o,-.14)),e.type){case"mouseover":d(a);break;case"mouseout":d(o);break;case"mousedown":d(r);break;case"mouseup":d(a);break;case"focus":var f=n.querySelector("button.confirm"),p=n.querySelector("button.cancel");l?p.style.boxShadow="none":f.style.boxShadow="none";break;case"click":p=n===s,f=h.isDescendant(n,s);if(!p&&!f&&u&&!t.allowOutsideClick)break;l&&c&&u?m(n,t):c&&u||i?y(0,t):h.isDescendant(n,s)&&"BUTTON"===s.tagName&&sweetAlert.close()}},handleConfirm:m,handleCancel:y},t.exports=n.default},{"./handle-dom":4,"./handle-swal-dom":6,"./utils":9}],4:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});function o(e,t){return new RegExp(" "+t+" ").test(" "+e.className+" ")}function a(e){e.style.opacity="",e.style.display="block"}function r(e){e.style.opacity="",e.style.display="none"}n.hasClass=o,n.addClass=function(e,t){o(e,t)||(e.className+=" "+t)},n.removeClass=function(e,t){var n=" "+e.className.replace(/[\t\r\n]/g," ")+" ";if(o(e,t)){for(;0<=n.indexOf(" "+t+" ");)n=n.replace(" "+t+" "," ");e.className=n.replace(/^\s+|\s+$/g,"")}},n.escapeHtml=function(e){var t=C.createElement("div");return t.appendChild(C.createTextNode(e)),t.innerHTML},n._show=a,n.show=function(e){if(e&&!e.length)return a(e);for(var t=0;t<e.length;++t)a(e[t])},n._hide=r,n.hide=function(e){if(e&&!e.length)return r(e);for(var t=0;t<e.length;++t)r(e[t])},n.isDescendant=function(e,t){for(var n=t.parentNode;null!==n;){if(n===e)return!0;n=n.parentNode}return!1},n.getTopMargin=function(e){e.style.left="-9999px",e.style.display="block";var t=e.clientHeight,n="undefined"!=typeof getComputedStyle?parseInt(getComputedStyle(e).getPropertyValue("padding-top"),10):parseInt(e.currentStyle.padding);return e.style.left="",e.style.display="none","-"+parseInt((t+n)/2)+"px"},n.fadeIn=function(e,t){var n,o,a;function r(){return a.apply(this,arguments)}+e.style.opacity<1&&(t=t||16,e.style.opacity=0,e.style.display="block",n=+new Date,a=function(){e.style.opacity=+e.style.opacity+(new Date-n)/100,n=+new Date,+e.style.opacity<1&&setTimeout(o,t)},r.toString=function(){return a.toString()},(o=r)()),e.style.display="block"},n.fadeOut=function(e,t){t=t||16,e.style.opacity=1;var n,o=+new Date,a=(n=function(){e.style.opacity=+e.style.opacity-(new Date-o)/100,o=+new Date,0<+e.style.opacity?setTimeout(a,t):e.style.display="none"},r.toString=function(){return n.toString()},r);function r(){return n.apply(this,arguments)}a()},n.fireClick=function(e){var t;"function"==typeof MouseEvent?(t=new MouseEvent("click",{view:w,bubbles:!1,cancelable:!0}),e.dispatchEvent(t)):C.createEvent?((t=C.createEvent("MouseEvents")).initEvent("click",!1,!1),e.dispatchEvent(t)):C.createEventObject?e.fireEvent("onclick"):"function"==typeof e.onclick&&e.onclick()},n.stopEventPropagation=function(e){"function"==typeof e.stopPropagation?(e.stopPropagation(),e.preventDefault()):w.event&&w.event.hasOwnProperty("cancelBubble")&&(w.event.cancelBubble=!0)}},{}],5:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});var c=e("./handle-dom"),d=e("./handle-swal-dom");n.default=function(e,t,n){var e=e||w.event,o=e.keyCode||e.which,a=n.querySelector("button.confirm"),r=n.querySelector("button.cancel"),s=n.querySelectorAll("button[tabindex]");if(-1!==[9,13,32,27].indexOf(o)){for(var l=e.target||e.srcElement,i=-1,u=0;u<s.length;u++)if(l===s[u]){i=u;break}9===o?(l=-1===i?a:i===s.length-1?s[0]:s[i+1],c.stopEventPropagation(e),l.focus(),t.confirmButtonColor&&d.setFocusStyle(l,t.confirmButtonColor)):13===o?"INPUT"===l.tagName&&(l=a).focus():27===o&&!0===t.allowEscapeKey&&c.fireClick(l=r,e)}},t.exports=n.default},{"./handle-dom":4,"./handle-swal-dom":6}],6:[function(e,t,n){function o(e){return e&&e.__esModule?e:{default:e}}function a(){var e=C.createElement("div");for(e.innerHTML=u.default;e.firstChild;)C.body.appendChild(e.firstChild)}Object.defineProperty(n,"__esModule",{value:!0});var r,s=e("./utils"),l=e("./handle-dom"),i=o(e("./default-params")),u=o(e("./injected-html")),c=(r=function(){var e=C.querySelector(".sweet-alert");return e||(a(),e=c()),e},d.toString=function(){return r.toString()},d);function d(){return r.apply(this,arguments)}function f(){var e=c();if(e)return e.querySelector("input")}function p(){return C.querySelector(".sweet-overlay")}function m(e){if(e&&13===e.keyCode)return!1;var t=(e=c()).querySelector(".sa-input-error"),t=(l.removeClass(t,"show"),e.querySelector(".sa-error-container"));l.removeClass(t,"show")}n.sweetAlertInitialize=a,n.getModal=c,n.getOverlay=p,n.getInput=f,n.setFocusStyle=function(e,t){t=s.hexToRgb(t);e.style.boxShadow="0 0 2px rgba("+t+", 0.8), inset 0 0 0 1px rgba(0, 0, 0, 0.05)"},n.openModal=function(e){var t=c();l.fadeIn(p(),10),l.show(t),l.addClass(t,"showSweetAlert"),l.removeClass(t,"hideSweetAlert"),w.previousActiveElement=C.activeElement;t.querySelector("button.confirm").focus(),setTimeout(function(){l.addClass(t,"visible")},500);var n,o=t.getAttribute("data-timer");"null"!==o&&""!==o&&(n=e,t.timeout=setTimeout(function(){(n?"true"===t.getAttribute("data-has-done-function"):null)?n(null):sweetAlert.close()},o))},n.resetInput=function(){var e=c(),t=f();l.removeClass(e,"show-input"),t.value=i.default.inputValue,t.setAttribute("type",i.default.inputType),t.setAttribute("placeholder",i.default.inputPlaceholder),m()},n.resetInputError=m,n.fixVerticalPosition=function(){c().style.marginTop=l.getTopMargin(c())}},{"./default-params":2,"./handle-dom":4,"./injected-html":7,"./utils":9}],7:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});n.default='<div class="sweet-overlay" tabIndex="-1"></div><div class="sweet-alert"><div class="sa-icon sa-error">\n <span class="sa-x-mark">\n <span class="sa-line sa-left"></span>\n <span class="sa-line sa-right"></span>\n </span>\n </div><div class="sa-icon sa-warning">\n <span class="sa-body"></span>\n <span class="sa-dot"></span>\n </div><div class="sa-icon sa-info"></div><div class="sa-icon sa-success">\n <span class="sa-line sa-tip"></span>\n <span class="sa-line sa-long"></span>\n\n <div class="sa-placeholder"></div>\n <div class="sa-fix"></div>\n </div><div class="sa-icon sa-custom"></div><h2>Title</h2>\n <p>Text</p>\n <fieldset>\n <input type="text" tabIndex="3" />\n <div class="sa-input-error"></div>\n </fieldset><div class="sa-error-container">\n <div class="icon">!</div>\n <p>Not valid!</p>\n </div><div class="sa-button-container">\n <button class="cancel" tabIndex="2">Cancel</button>\n <div class="sa-confirm-button-container">\n <button class="confirm" tabIndex="1">OK</button><div class="la-ball-fall">\n <div></div>\n <div></div>\n <div></div>\n </div>\n </div>\n </div></div>',t.exports=n.default},{}],8:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});var u=e("./utils"),c=e("./handle-swal-dom"),d=e("./handle-dom"),f=["error","warning","info","success","input","prompt"];n.default=function(a){var e,t,r=c.getModal(),n=r.querySelector("h2"),o=r.querySelector("p"),s=r.querySelector("button.cancel"),l=r.querySelector("button.confirm");if(n.innerHTML=a.html?a.title:d.escapeHtml(a.title).split("\n").join("<br>"),o.innerHTML=a.html?a.text:d.escapeHtml(a.text||"").split("\n").join("<br>"),a.text&&d.show(o),a.customClass?(d.addClass(r,a.customClass),r.setAttribute("data-custom-class",a.customClass)):(n=r.getAttribute("data-custom-class"),d.removeClass(r,n),r.setAttribute("data-custom-class","")),d.hide(r.querySelectorAll(".sa-icon")),a.type&&!u.isIE8()){var o=function(){for(var e=!1,t=0;t<f.length;t++)if(a.type===f[t]){e=!0;break}if(!e)return logStr("Unknown alert type: "+a.type),{v:!1};var n=S,o=(-1!==["success","error","warning","info"].indexOf(a.type)&&(n=r.querySelector(".sa-icon.sa-"+a.type),d.show(n)),c.getInput());switch(a.type){case"success":d.addClass(n,"animate"),d.addClass(n.querySelector(".sa-tip"),"animateSuccessTip"),d.addClass(n.querySelector(".sa-long"),"animateSuccessLong");break;case"error":d.addClass(n,"animateErrorIcon"),d.addClass(n.querySelector(".sa-x-mark"),"animateXMark");break;case"warning":d.addClass(n,"pulseWarning"),d.addClass(n.querySelector(".sa-body"),"pulseWarningIns"),d.addClass(n.querySelector(".sa-dot"),"pulseWarningIns");break;case"input":case"prompt":o.setAttribute("type",a.inputType),o.value=a.inputValue,o.setAttribute("placeholder",a.inputPlaceholder),d.addClass(r,"show-input"),setTimeout(function(){o.focus(),o.addEventListener("keyup",swal.resetInputError)},400)}}();if("object"==typeof o)return o.v}a.imageUrl&&((n=r.querySelector(".sa-icon.sa-custom")).style.backgroundImage="url("+a.imageUrl+")",d.show(n),e=o=80,a.imageSize&&(i=(t=a.imageSize.toString().split("x"))[0],t=t[1],i&&t?(o=i,e=t):logStr("Parameter imageSize expects value with format WIDTHxHEIGHT, got "+a.imageSize)),n.setAttribute("style",n.getAttribute("style")+"width:"+o+"px; height:"+e+"px")),r.setAttribute("data-has-cancel-button",a.showCancelButton),a.showCancelButton?s.style.display="inline-block":d.hide(s),r.setAttribute("data-has-confirm-button",a.showConfirmButton),a.showConfirmButton?l.style.display="inline-block":d.hide(l),a.cancelButtonText&&(s.innerHTML=d.escapeHtml(a.cancelButtonText)),a.confirmButtonText&&(l.innerHTML=d.escapeHtml(a.confirmButtonText)),a.confirmButtonColor&&(l.style.backgroundColor=a.confirmButtonColor,l.style.borderLeftColor=a.confirmLoadingButtonColor,l.style.borderRightColor=a.confirmLoadingButtonColor,c.setFocusStyle(l,a.confirmButtonColor)),r.setAttribute("data-allow-outside-click",a.allowOutsideClick);var i=!!a.doneFunction;r.setAttribute("data-has-done-function",i),a.animation?"string"==typeof a.animation?r.setAttribute("data-animation",a.animation):r.setAttribute("data-animation","pop"):r.setAttribute("data-animation","none"),r.setAttribute("data-timer",a.timer)},t.exports=n.default},{"./handle-dom":4,"./handle-swal-dom":6,"./utils":9}],9:[function(e,t,n){Object.defineProperty(n,"__esModule",{value:!0});n.extend=function(e,t){for(var n in t)t.hasOwnProperty(n)&&(e[n]=t[n]);return e},n.hexToRgb=function(e){e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return e?parseInt(e[1],16)+", "+parseInt(e[2],16)+", "+parseInt(e[3],16):null},n.isIE8=function(){return w.attachEvent&&!w.addEventListener},n.logStr=function(e){w.console&&w.console.log("SweetAlert: "+e)},n.colorLuminance=function(e,t){(e=String(e).replace(/[^0-9a-f]/gi,"")).length<6&&(e=e[0]+e[0]+e[1]+e[1]+e[2]+e[2]),t=t||0;for(var n,o="#",a=0;a<3;a++)n=parseInt(e.substr(2*a,2),16),o+=("00"+(n=Math.round(Math.min(Math.max(0,n+n*t),255)).toString(16))).substr(n.length);return o}},{}]},{},[1]),"function"==typeof define&&define.amd?define(function(){return sweetAlert}):"undefined"!=typeof module&&module.exports&&(module.exports=sweetAlert)}(window,document);
这样模板就完成了,接下来在已有的js中添加以下代码来让公告显示:
我这里提供两个版本,手动关闭和倒计时关闭,你也可以融合以下
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37// 公告(必须手动关闭版本)
function welcome(){
let welcome_text = '欢迎光顾mccsjs的小窝~'
if(document.referrer!==''){
let referrer=document.referrer.split("/")[2];
welcome_text="欢迎来自"+referrer.toUpperCase()+"的用户!";//获取用户来源域名
}
swal({
title: " 欢迎!",
text: welcome_text+'\n欢迎',//欢迎文本,可自行修改
imageUrl: "/img/head.jpg",//图片,自行修改位置
showConfirmButton: true, // 显示确认按钮
confirmButtonText: "OK", // 按钮文字设为OK
closeOnConfirm: true // 点击OK后关闭
});
}
$(document).ready(()=>{
welcome()
})倒计时3秒关闭版本:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17// 公告
function welcome(){
let welcome_text = '欢迎光顾mccsjs的小窝~'
if(document.referrer!==''){
let referrer=document.referrer.split("/")[2];
welcome_text="欢迎来自"+referrer.toUpperCase()+"的用户!";//获取用户来源域名
}
swal({
title: " 欢迎!",
text: welcome_text+'\n欢迎',//欢迎文本,可自行修改
imageUrl: "/img/head.jpg",//图片,自行修改位置
timer: 3000,//弹出时间,延长到5秒以便用户阅读
});
}
$(document).ready(()=>{//若未引用JQuery,请引用
welcome()
})
融合版本1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20// 公告
function welcome(){
let welcome_text = '欢迎光顾mccsjs的小窝~'
if(document.referrer!==''){
let referrer=document.referrer.split("/")[2];
welcome_text="欢迎来自"+referrer.toUpperCase()+"的用户!";//获取用户来源域名
}
swal({
title: " 欢迎!",
text: welcome_text+'\n近期将更换域名至seln.cn',//欢迎文本,可自行修改
imageUrl: "/img/head.jpg",//图片,自行修改位置
timer: 5000,//弹出时间,延长到5秒以便用户阅读
showConfirmButton: true, // 显示确认按钮
confirmButtonText: "OK", // 按钮文字设为OK
closeOnConfirm: true // 点击OK后关闭
});
}
$(document).ready(()=>{//若未引用JQuery,请引用
welcome()
})
- 结尾
注意,三者只能存其一
接下来三连试试效果1
hexo c;hexo g;hexo s