M infiniteGrid
by hohoya33
HTML
/*
Copyright (c) 2017 NAVER Corp.
@egjs/persist project is licensed under the MIT license
@egjs/persist JavaScript library
@version 2.2.1
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t.eg=t.eg||{},t.eg.Persist=e())}(this,function(){"use strict";var r="undefined"!=typeof window&&window||{},a=r.console,o=(r.document,r.history),t=r.localStorage,i=r.location,e=r.sessionStorage,n=r.navigator,s=r.parseFloat,f=r.performance,c="___persist___",u="state"+c,l="depths",p="lastUrl",g=f&&f.navigation,v=g&&g.TYPE_NAVIGATE||0,d=(g&&g.TYPE_RELOAD,g&&g.TYPE_BACK_FORWARD||2),h=o&&"replaceState"in o&&"state"in o;function y(t){if(t){var e="__tmp__"+c;try{return t.setItem(e,c),t.getItem(e)===c}catch(t){return!1}}}var w,m=(y(e)?w=e:y(t)&&(w=t),w);function E(){console.warn("window.history or session/localStorage has no valid format data to be handled in persist.")}function _(){return m}function x(t){var e,n;if(m?n=m.getItem(t):o.state?"object"==typeof o.state&&null!==o.state?n=o.state[t]:E():n=o.state,null===n)return{};var r="string"==typeof n&&0<n.length&&"null"!==n;try{var i=!("object"!=typeof(e=JSON.parse(n))||e instanceof Array);if(!r||!i)throw new Error}catch(t){E(),e={}}return e}function S(t,e){if(h||m){var n=x(t)[e];return"null"!==n&&void 0!==n||(n=null),n}}function A(t,e){if(m)e?m.setItem(t,JSON.stringify(e)):m.removeItem(t);else try{var n=o&&null!=o.state?o.state:{};o&&"object"==typeof n?(n[t]=JSON.stringify(e),o.replaceState(n,document.title,i.href)):console.warn("To use a history object, it must be an object that is not a primitive type.")}catch(t){console.warn(t.message)}e?r[c]=!0:delete r[c]}function R(t,e,n){if(h||m){var r=x(t);r[e]=n,A(t,r)}}function N(t){A(t,null)}var O,b,I,j,P,k=n?n.userAgent:"",T=(O=new RegExp("iPhone|iPad","i").test(k),b=new RegExp("Mac","i").test(k)&&!new RegExp("Chrome","i").test(k)&&new RegExp("Apple","i").test(k),I=new RegExp("Android ","i").test(k),j=new...CSS
/* infinite grid reset */
.cm_grid_lst{position:relative;margin:0;
background-image:
linear-gradient( #f1f3f5 100px, transparent 0 ),
linear-gradient( 100deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 80% ),
linear-gradient( #f1f3f5 10px, transparent 0 ),
linear-gradient( #f1f3f5 10px, transparent 0 ),
linear-gradient( #f1f3f5 10px, transparent 0 ),
linear-gradient( #f1f3f5 10px, transparent 0 );
background-repeat: repeat-y;
background-size:
100px 200px,
50px 200px, /* highlight */
150px 200px,
350px 200px,
300px 200px,
250px 200px;
background-position:
20px 20px,
140px 0, /* highlight */
140px 20px,
140px 40px,
140px 60px,
140px 80px;
}
.grid_loader{opacity:0}
.grid_loader.on{opacity:1}
.grid_loading{display:flex;justify-content:center;align-items:center;height:74px;overflow:hidden;background: #fff}
.grid_loading>div{width:10px;height:10px;background-color:#9880ff;border-radius:100%;display:inline-block;margin:0 3px;-webkit-animation:bouncedelay 1.4s infinite ease-in-out both;animation:bouncedelay 1.4s infinite ease-in-out both}
.grid_loading .dot1{-webkit-animation-delay:-0.32s;animation-delay:-0.32s}
.grid_loading .dot2{-webkit-animation-delay:-0.16s;animation-delay:-0.16s}
@-webkit-keyframes bouncedelay {
0%, 80%, 100% { -webkit-transform: scale(0) }
40% { -webkit-transform: scale(1.0) }
}
@keyframes bouncedelay {
0%, 80%, 100% {
-webkit-transform: scale(0);transform: scale(0);
} 40% {
-webkit-transform: scale(1.0);transform: scale(1.0);
}
}
.cm_grid_lst>ul{min-height:800px}
.cm_grid_lst>ul>li{width:100%;padding-bottom:10px;border:0;box-sizing:border-box;background:#fff}
.cm_grid_lst>ul>li:nth-child(even):before{display:none}
.cm_grid_lst>ul>li:nth-child(odd):before{display:none}
.cm_grid_lst>ul>li:after{display:block !important;position:absolute;top:auto;bottom:0;left:0;right:0;z-index:1;height:10px;border-top:1px solid #e1e1e1;background:#f0f1f5}
.cm_grid_lst...JavaScript
/*
Copyright (c) 2017 NAVER Corp.
@egjs/persist project is licensed under the MIT license
@egjs/persist JavaScript library
@version 2.2.1
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t.eg=t.eg||{},t.eg.Persist=e())}(this,function(){"use strict";var r="undefined"!=typeof window&&window||{},a=r.console,o=(r.document,r.history),t=r.localStorage,i=r.location,e=r.sessionStorage,n=r.navigator,s=r.parseFloat,f=r.performance,c="___persist___",u="state"+c,l="depths",p="lastUrl",g=f&&f.navigation,v=g&&g.TYPE_NAVIGATE||0,d=(g&&g.TYPE_RELOAD,g&&g.TYPE_BACK_FORWARD||2),h=o&&"replaceState"in o&&"state"in o;function y(t){if(t){var e="__tmp__"+c;try{return t.setItem(e,c),t.getItem(e)===c}catch(t){return!1}}}var w,m=(y(e)?w=e:y(t)&&(w=t),w);function E(){console.warn("window.history or session/localStorage has no valid format data to be handled in persist.")}function _(){return m}function x(t){var e,n;if(m?n=m.getItem(t):o.state?"object"==typeof o.state&&null!==o.state?n=o.state[t]:E():n=o.state,null===n)return{};var r="string"==typeof n&&0<n.length&&"null"!==n;try{var i=!("object"!=typeof(e=JSON.parse(n))||e instanceof Array);if(!r||!i)throw new Error}catch(t){E(),e={}}return e}function S(t,e){if(h||m){var n=x(t)[e];return"null"!==n&&void 0!==n||(n=null),n}}function A(t,e){if(m)e?m.setItem(t,JSON.stringify(e)):m.removeItem(t);else try{var n=o&&null!=o.state?o.state:{};o&&"object"==typeof n?(n[t]=JSON.stringify(e),o.replaceState(n,document.title,i.href)):console.warn("To use a history object, it must be an object that is not a primitive type.")}catch(t){console.warn(t.message)}e?r[c]=!0:delete r[c]}function R(t,e,n){if(h||m){var r=x(t);r[e]=n,A(t,r)}}function N(t){A(t,null)}var O,b,I,j,P,k=n?n.userAgent:"",T=(O=new RegExp("iPhone|iPad","i").test(k),b=new RegExp("Mac","i").test(k)&&!new RegExp("Chrome","i").test(k)&&new RegExp("Apple","i").test(k),I=new RegExp("Android ","i").test(k),j=new...