关于本人 🔗 ChemanLau Web/App Developer 近期观影 🔗 8.7 朱元璋 9.3 大秦帝国之裂变 9.8 大明王朝1566 6 大明风华 近期阅读 🔗 9.4 传习录（中华经典名著全本全注全译/三全本） 8.8 素书 9.2 鬼谷子的人生智慧 7.5 鬼谷子 近期图册 🔗 document.addEventListener("DOMContentLoaded", () = { let limit = 8 var memoUrl = "https://api.mm.xlap.top/" var galleryUrl = memoUrl+"api/v1/memo/all?rowStatus=NORMAL&limit="+limit let nowNum = 1; fetch(galleryUrl).then(res = res.json()).then( resdata ={ var result = '',resultAll="",data = resdata for(var i=0;i { if(nowNum `; title ? result += `${title}` : ''; time ? result += `${time}` : ''; result += ``; } }); } if(data[i].resourceList && data[i].resourceList.length 0){ var resourceList = data[i].resourceList; for(var j=0;j '+galleryTitle+''+galleryTime+'' } } } } var galleryDom = document.querySelector('#album'); var galleryBefore = `` var galleryAfter = `` resultAll = galleryBefore + result + galleryAfter galleryDom.innerHTML = resultAll //相对时间 window.Lately && Lately.init({ target: '.photo-time'}); }); }); .memos-photo-wrapper { grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: .5rem; display: grid; width: 100%; gap: .5rem; } .memos-photo{ position: relative; overflow: hidden; border-radius: .25rem; height: 194px; } .memos-photoimg { min-height: 100%; width: auto; min-width: 100%; cursor: pointer; -o-object-fit: cover; object-fit: cover; height: auto; animation: fadeIn 1s; transition: all .4s ease-in-out; } .memos-photo span.photo-title,.memos-photo span.photo-time{background: rgba(0, 0, 0, 0.3);padding:0px 8px;font-size:0.9rem;color: #fff;display:none;animation: fadeIn 1s;} .memos-photo span.photo-title{position:absolute;bottom:4px;left:4px;} .memos-photo span.photo-time{position:absolute;top:4px;left:4px;font-size:0.8rem;} .memos-photo:hover span.photo-title,.memos-photo:hover span.photo-time{display:block !important;} @keyframes fadeIn{ 0% {opacity: 0;} 100% {opacity: 1;} } @media screen and (min-width:480px) and (max-width: 899px) { .memos-photo-wrapper{ grid-template-columns: repeat(3,minmax(0,1fr)); } .memos-photo{ height: 201px; } } @media only screen and (max-width: 479px) { .memos-photo-wrapper{ grid-template-columns: repeat(2,minmax(0,1fr)); } .memos-photo{ height: 171px; } } 项目维护 🔗 Kinect4AlphaRobot 体感控制机器人 DongbazWoodcut 东巴人木刻 FlutterFlipClock 一个基于Flutter的翻页时钟App
