{"id":10,"date":"2025-11-04T23:38:18","date_gmt":"2025-11-04T15:38:18","guid":{"rendered":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/?page_id=10"},"modified":"2026-03-16T09:58:19","modified_gmt":"2026-03-16T01:58:19","slug":"%e4%bd%9c%e5%93%81%e9%9b%86-%e8%bc%aa%e6%92%ad%e5%9c%96","status":"publish","type":"page","link":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/?page_id=10","title":{"rendered":"\u4f5c\u54c1\u96c6\/\u8f2a\u64ad\u5716"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\n\r\nAllinone Gallery Slider<\/title>\r\n<style>\r\n:root{\r\n \/* \u4fee\u6539\uff1a\u80cc\u666f\u8272\u7d71\u4e00\u70ba #f7f7ed *\/\r\n --bg-color:#f7f7ed; \r\n --rose:#C39898; \r\n --gold:#BFA58D; \r\n --ink:#3F3A37;\r\n}\r\n*{box-sizing:border-box} img{max-width:100%;display:block}\r\nbody{background:var(--bg-color);color:var(--ink);line-height:1.7;margin:0;}\r\n\r\n\/* ============= \u67d4\u5149\u52d5\u614b\u80cc\u666f\uff08\u4fee\u6b63\u70ba\u9ad8\u96c5\u7c73\u767d\u900f\u5149\u7248\uff09 ============= *\/\r\n.softlight-bg{\r\n position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden;\r\n background: var(--bg-color); \/* \u7d14\u8272\u5e95 *\/\r\n}\r\n\r\n\/* \u8abf\u6574\u5149\u6688\uff1a\u6539\u7528\u767d\u8272\u8207\u6975\u6de1\u91d1\uff0c\u907f\u514d\u8b93 #f7f7ed \u8b8a\u9ad2 *\/\r\n.softlight-bg::before,\r\n.softlight-bg::after{\r\n content:\"\"; position:absolute; inset:-25%;\r\n background:\r\n radial-gradient(900px 520px at 20% 16%, rgba(255,255,255,0.8), transparent 60%),\r\n radial-gradient(780px 440px at 80% 70%, rgba(255,255,255,0.6), transparent 62%),\r\n radial-gradient(620px 420px at 50% 50%, rgba(191,165,141,0.08), transparent 60%);\r\n filter: blur(20px);\r\n animation: mist 40s linear infinite;\r\n opacity:1; mix-blend-mode:normal;\r\n}\r\n.softlight-bg::after{ animation-duration:60s; opacity:0.5; mix-blend-mode:overlay; }\r\n\r\n@keyframes mist{\r\n 0%{ transform:translate3d(0,0,0) }\r\n 50%{ transform:translate3d(2%,-1.5%,0) }\r\n 100%{ transform:translate3d(0,0,0) }\r\n}\r\n\r\n\/* \u91d1\u7dda + \u5fae\u7c92 (\u7dad\u6301\u4e0d\u8b8a) *\/\r\n.softlight-bg .kintsugi{ position:absolute; inset:0 }\r\n.softlight-bg .kintsugi::before,\r\n.softlight-bg .kintsugi::after{\r\n content:\"\"; position:absolute; top:-8%; width:1px; height:116%;\r\n background:linear-gradient(180deg,transparent,var(--gold),transparent);\r\n opacity:0.3; filter:blur(0.5px); \/* \u7a0d\u5fae\u8abf\u9ad8\u900f\u660e\u5ea6\u9069\u61c9\u6dfa\u8272\u5e95 *\/\r\n}\r\n.softlight-bg .kintsugi::before{ left:6%; animation:kfloat 16s ease-in-out infinite }\r\n.softlight-bg .kintsugi::after{ right:8%; animation:kfloat 18s ease-in-out infinite reverse }\r\n@keyframes kfloat{ 0%,100%{ transform:translateY(-2%) } 50%{ transform:translateY(2%) } }\r\n\r\n.softlight-bg .sparkles{ position:absolute; inset:0 }\r\n.softlight-bg .sparkles span{\r\n position:absolute; width:4px; height:4px; border-radius:50%;\r\n background:rgba(191, 165, 141, 0.6); \/* \u5fae\u7c92\u6539\u70ba\u6de1\u91d1\u8272 *\/\r\n box-shadow:0 0 8px rgba(191, 165, 141, 0.4);\r\n animation: rise 20s linear infinite; opacity:0;\r\n}\r\n.softlight-bg .sparkles span:nth-child(1){ left:12%; bottom:-10%; animation-delay:.3s }\r\n.softlight-bg .sparkles span:nth-child(2){ left:30%; bottom:-14%; width:3px; height:3px; animation-delay:1.3s }\r\n.softlight-bg .sparkles span:nth-child(3){ left:54%; bottom:-12%; width:5px; height:5px; animation-delay:2.1s }\r\n.softlight-bg .sparkles span:nth-child(4){ left:72%; bottom:-16%; width:4px; height:4px; animation-delay:1.7s }\r\n.softlight-bg .sparkles span:nth-child(5){ left:86%; bottom:-18%; width:3px; height:3px; animation-delay:2.7s }\r\n@keyframes rise{\r\n 0%{ transform:translateY(0); opacity:0 }\r\n 20%{ opacity:0.8 }\r\n 80%{ opacity:0.8 }\r\n 100%{ transform:translateY(-100vh); opacity:0 }\r\n}\r\n\r\n\/* ============= \u5167\u5bb9\u5bb9\u5668 & \u9801\u9996 ============= *\/\r\n.wrap{max-width:1200px;margin:0 auto;padding:40px 20px 32px;position:relative;z-index:2}\r\n\r\n.hero{\r\n border-radius:0;\r\n padding:10px 10px 30px;\r\n text-align:center;\r\n background:transparent;\r\n color:var(--ink);\r\n}\r\n.hero h2{\r\n margin:0;\r\n font-family:\"Playfair Display\",\"Times New Roman\",serif;\r\n font-size:clamp(28px,5vw,44px);\r\n letter-spacing:.18em;\r\n text-transform:uppercase;\r\n font-weight:400;\r\n}\r\n.hero p{\r\n margin:14px auto 0;\r\n max-width:640px;\r\n font-size:14px;\r\n opacity:.9;\r\n}\r\n\r\n\/* ============= \u5916\u6846\uff08\u6de1\u91d1\u908a\uff0b\u7559\u767d\uff09 ============= *\/\r\n.frame-border{\r\n position:relative;border-radius:24px;padding:32px 18px 20px;margin-top:8px;\r\n background:\r\n linear-gradient(#FDFBF7,#FDFBF7) padding-box, \/* \u4fdd\u6301\u6846\u5167\u767d\u8272\u8cea\u611f *\/\r\n linear-gradient(135deg, rgba(191,165,141,.45), rgba(219,181,181,.45)) border-box;\r\n border:1px solid transparent;\r\n box-shadow:0 18px 40px rgba(0,0,0,.06);\r\n}\r\n.frame-border::after{\r\n content:\"\";position:absolute;inset:16px;border-radius:18px;\r\n border:1px solid rgba(191,165,141,.28);pointer-events:none;\r\n}\r\n\r\n\/* ============= \u8f2a\u64ad\uff1a\u76f8\u6846\u756b\u5eca\u98a8 ============= *\/\r\n.slider{\r\n position:relative;\r\n overflow:hidden;\r\n border-radius:18px;\r\n background:transparent;\r\n}\r\n.slides{\r\n display:flex;\r\n transition:transform .8s ease-in-out;\r\n}\r\n.slide{\r\n min-width:100%;\r\n padding:10px 12px 24px;\r\n display:flex;\r\n flex-direction:column;\r\n align-items:center;\r\n justify-content:flex-start;\r\n}\r\n\r\n\/* \u4e3b\u5716\uff1a\u50cf\u653e\u5728\u684c\u4e0a\uff0f\u756b\u6846\u88e1 *\/\r\n.slide img{\r\n width:min(420px,80vw);\r\n height:auto;\r\n border-radius:18px;\r\n border:12px solid #FBF8F3; \/* \u76f8\u6846\u908a *\/\r\n background:#EDE5DA;\r\n box-shadow:0 18px 40px rgba(0,0,0,.16);\r\n cursor:zoom-in;\r\n}\r\n\r\n\/* \u6a19\u984c\u5728\u5716\u7247\u4e0b\u65b9 *\/\r\n.caption{\r\n position:static;\r\n margin-top:16px;\r\n padding:0 8px;\r\n text-align:center;\r\n background:none;\r\n color:var(--ink);\r\n}\r\n.caption h3{\r\n margin:0 0 4px;\r\n font-size:16px;\r\n letter-spacing:.06em;\r\n}\r\n.small{\r\n font-size:13px;\r\n opacity:.7;\r\n}\r\n\r\n\/* \u7e2e\u5716\u5217 *\/\r\n.thumb-row{\r\n display:flex;\r\n gap:10px;\r\n overflow-x:auto;\r\n scrollbar-width:none;\r\n margin-top:14px;\r\n padding:8px 2px 4px;\r\n justify-content:center;\r\n flex-wrap:wrap;\r\n}\r\n.thumb{\r\n flex:0 0 110px;\r\n height:70px;\r\n border-radius:12px;\r\n overflow:hidden;\r\n border:2px solid transparent;\r\n cursor:pointer;\r\n transition:.25s;\r\n background:#F4EEE6;\r\n}\r\n.thumb img{\r\n width:100%;\r\n height:100%;\r\n object-fit:cover;\r\n}\r\n.thumb.active{\r\n border-color:var(--rose);\r\n transform:scale(1.03);\r\n box-shadow:0 8px 18px rgba(0,0,0,.12);\r\n}\r\n\r\n\/* \u624b\u6a5f\u7248\u8abf\u6574 *\/\r\n@media (max-width:768px){\r\n .wrap{padding:32px 14px}\r\n .frame-border{padding:24px 12px 16px}\r\n .slide img{\r\n width:min(360px,86vw);\r\n border-radius:16px;\r\n }\r\n .thumb-row{\r\n display:grid !important;\r\n grid-template-columns:repeat(3,minmax(0,1fr));\r\n gap:10px;\r\n padding:10px 4px!important;\r\n }\r\n .thumb{\r\n flex:initial!important;\r\n height:80px!important;\r\n border-radius:12px!important;\r\n }\r\n}\r\n@media (max-width:480px){\r\n .thumb-row{grid-template-columns:repeat(2,minmax(0,1fr))}\r\n}\r\n\r\n\/* Lightbox *\/\r\n.lightbox{\r\n position:fixed;inset:0;background:rgba(0,0,0,.8);display:none;\r\n align-items:center;justify-content:center;z-index:9999;padding:24px;\r\n}\r\n.lightbox.open{display:flex}\r\n.lightbox img{\r\n max-width:96vw;max-height:86vh;border-radius:14px;\r\n box-shadow:0 18px 50px rgba(0,0,0,.5)\r\n}\r\n.lightbox .close{\r\n position:absolute;top:16px;right:18px;color:#fff;\r\n background:rgba(255,255,255,.15);\r\n border:1px solid rgba(255,255,255,.35);\r\n width:42px;height:42px;border-radius:999px;\r\n display:grid;place-items:center;font-size:22px;cursor:pointer\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- \u67d4\u5149\u52d5\u614b\u80cc\u666f\u5c64 -->\r\n<div class=\"softlight-bg\" aria-hidden=\"true\">\r\n <div class=\"kintsugi\"><\/div>\r\n <div class=\"sparkles\">\r\n <span><\/span><span><\/span><span><\/span><span><\/span><span><\/span>\r\n <\/div>\r\n<\/div>\r\n\r\n<section class=\"wrap\">\r\n <!-- \u6a19\u984c\u5340 -->\r\n <div class=\"hero\">\r\n <h2>FEEL THIS MOMENT<\/h2>\r\n <p>\r\n With the wonder of your soul, every color is a gentle whisper.<br>\r\n Don\u2019t try so hard, the most beautiful things appear when you simply feel.\r\n <\/p>\r\n <\/div>\r\n\r\n <!-- \u756b\u5eca\u5916\u6846 + \u8f2a\u64ad -->\r\n <div class=\"frame-border\">\r\n <div class=\"slider\" id=\"slider\">\r\n <div class=\"slides\" id=\"slides\">\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/3C86E422-A43D-4DC3-AA03-B33BFE889241-scaled.jpg\" alt=\"\u67d4\u5149\u4e4b\u82b1 \u00b7 \u611b\u7684\u7dbb\u653e\">\r\n <div class=\"caption\">\r\n <h3>\u67d4\u5149\u4e4b\u82b1 \u00b7 \u611b\u7684\u7dbb\u653e<\/h3>\r\n <div class=\"small\">\u9748\u9b42\u82b1\u5712<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/5FD578BB-07AA-4397-A9F4-B672E6717029-scaled.jpg\" alt=\"\u6d77\u4e4b\u82b1 \u00b7 \u975c\u67d4\u7dbb\u653e\">\r\n <div class=\"caption\">\r\n <h3>\u6d77\u4e4b\u82b1 \u00b7 \u975c\u67d4\u7dbb\u653e<\/h3>\r\n <div class=\"small\">\u80fd\u91cf\u82b1\u7cfb\u5217<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/D02B7443-1FCD-4676-8A4A-8AF491A4B464-scaled.jpg\" alt=\"\u6e5b\u85cd\u5fc3\u6d41 \u00b7 \u975c\u8b10\u89ba\u5bdf\">\r\n <div class=\"caption\">\r\n <h3>\u6e5b\u85cd\u5fc3\u6d41 \u00b7 \u975c\u8b10\u89ba\u5bdf<\/h3>\r\n <div class=\"small\">\u610f\u8b58\u6d41\u5275\u4f5c<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/02E829C8-2B4F-4DE9-8C39-23E29C41A461-scaled.jpg\" alt=\"\u8d64\u7d05\u5730\u8108 \u00b7 \u5167\u5728\u71c3\u71d2\">\r\n <div class=\"caption\">\r\n <h3>\u8d64\u7d05\u5730\u8108 \u00b7 \u5167\u5728\u71c3\u71d2<\/h3>\r\n <div class=\"small\">\u60c5\u7dd2\u6d41\u52d5<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/1A786713-5FF1-471E-B7BD-11EAE9CDB087-scaled.jpg\" alt=\"\u591c\u7a7a\u6d41\u91d1 \u00b7 \u7121\u9650\u7684\u5b87\u5b99\">\r\n <div class=\"caption\">\r\n <h3>\u591c\u7a7a\u6d41\u91d1 \u00b7 \u7121\u9650\u7684\u5b87\u5b99<\/h3>\r\n <div class=\"small\">\u9152\u7cbe\u58a8\u6c34\u85dd\u8853<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- \u7e2e\u5716\u5217 -->\r\n <div class=\"thumb-row\" id=\"thumbs\">\r\n <div class=\"thumb active\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/3C86E422-A43D-4DC3-AA03-B33BFE889241-scaled.jpg\" alt=\"\">\r\n <\/div>\r\n <div class=\"thumb\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/5FD578BB-07AA-4397-A9F4-B672E6717029-scaled.jpg\" alt=\"\">\r\n <\/div>\r\n <div class=\"thumb\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/D02B7443-1FCD-4676-8A4A-8AF491A4B464-scaled.jpg\" alt=\"\">\r\n <\/div>\r\n <div class=\"thumb\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/02E829C8-2B4F-4DE9-8C39-23E29C41A461-scaled.jpg\" alt=\"\">\r\n <\/div>\r\n <div class=\"thumb\">\r\n <img decoding=\"async\" src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/11\/1A786713-5FF1-471E-B7BD-11EAE9CDB087-scaled.jpg\" alt=\"\">\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<script>\r\n\/* \u81ea\u52d5\u64ad\u653e\uff0b\u7e2e\u5716\u9ede\u64ca\uff0b\u6ed1\u52d5\uff0bLightbox *\/\r\nconst slidesEl=document.querySelector('#slides');\r\nconst slideImgs=[...document.querySelectorAll('.slide img')];\r\nconst thumbs=[...document.querySelectorAll('.thumb')];\r\nlet index=0,auto=true,resumeTimer=null;\r\n\r\nfunction showSlide(n,fromUser=false){\r\n index=(n+thumbs.length)%thumbs.length;\r\n slidesEl.style.transform=`translateX(-${index*100}%)`;\r\n thumbs.forEach((t,i)=>t.classList.toggle('active',i===index));\r\n if(fromUser){\r\n auto=false;\r\n clearTimeout(resumeTimer);\r\n resumeTimer=setTimeout(()=>auto=true,6000);\r\n }\r\n}\r\nthumbs.forEach((t,i)=>t.addEventListener('click',()=>showSlide(i,true)));\r\nsetInterval(()=>{if(auto)showSlide(index+1);},5000);\r\n\r\nlet startX=0,touching=false;\r\nslidesEl.addEventListener('touchstart',e=>{\r\n touching=true;startX=e.touches[0].clientX;auto=false;\r\n},{passive:true});\r\nslidesEl.addEventListener('touchend',e=>{\r\n if(!touching)return;\r\n const dx=e.changedTouches[0].clientX-startX;\r\n if(Math.abs(dx)>40)showSlide(index+(dx<0?1:-1));\r\n touching=false;\r\n clearTimeout(resumeTimer);\r\n resumeTimer=setTimeout(()=>auto=true,3000);\r\n},{passive:true});\r\n\r\n\/* Lightbox *\/\r\nconst lb=document.createElement('div');\r\nlb.className='lightbox';\r\nlb.innerHTML='<div class=\"close\" aria-label=\"Close\">\u00d7<\/div><img alt=\"preview\"\/>';\r\ndocument.body.appendChild(lb);\r\nconst lbImg=lb.querySelector('img');\r\nconst closeLB=()=>lb.classList.remove('open');\r\nlb.addEventListener('click',e=>{\r\n if(e.target===lb||e.target.classList.contains('close'))closeLB();\r\n});\r\ndocument.addEventListener('keydown',e=>{\r\n if(e.key==='Escape')closeLB();\r\n});\r\nslideImgs.forEach(img=>{\r\n img.addEventListener('click',()=>{\r\n lbImg.src=img.src;\r\n lb.classList.add('open');\r\n });\r\n});\r\nshowSlide(0);\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-947dfc2 e-con-full e-flex e-con e-parent\" data-id=\"947dfc2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-39c4638 elementor-widget elementor-widget-html\" data-id=\"39c4638\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- Allinone\uff5cIG Reels \u98a8\uff1a\u6ed1\u5230\u81ea\u52d5\u64ad\u653e(\u975c\u97f3)\uff0b\u6ed1\u8d70\u81ea\u52d5\u66ab\u505c\uff0b\u9ede\u4e00\u4e0b\u64ad\u653e\/\u66ab\u505c\uff0b\u53f3\u4e0b\u5207\u63db\u8072\u97f3 -->\r\n<!-- \u4fee\u6539\u8aaa\u660e\uff1a\u80cc\u666f\u6539\u70ba #f7f7ed\uff0c\u4e26\u79fb\u9664\u4e86\u539f\u672c\u7684\u7b2c\u4e00\u652f\u5f71\u7247 -->\r\n<style>\r\n :root{\r\n --bg:#f7f7ed; \/* \u4fee\u6539\uff1a\u7d71\u4e00\u80cc\u666f\u8272 *\/\r\n --card:#ffffffc7;\r\n --ink:#2f2a25;\r\n --muted:#6b625a;\r\n --gold:#bfa58d;\r\n --shadow:0 14px 40px rgba(0,0,0,.10);\r\n --radius:18px;\r\n }\r\n\r\n .allinone-reels{\r\n font-family: system-ui,-apple-system,\"Noto Sans TC\",\"PingFang TC\",\"Microsoft JhengHei\",sans-serif;\r\n color:var(--ink);\r\n background: var(--bg);\r\n border-radius: var(--radius);\r\n box-shadow: var(--shadow);\r\n padding: 26px 22px 24px;\r\n overflow:hidden;\r\n }\r\n\r\n .allinone-reels .head{\r\n display:flex;\r\n align-items:flex-end;\r\n justify-content:space-between;\r\n gap:12px;\r\n margin-bottom:16px;\r\n }\r\n .allinone-reels .title{\r\n margin:0;\r\n font-size:20px;\r\n letter-spacing:.06em;\r\n font-weight:900;\r\n }\r\n .allinone-reels .sub{\r\n margin:6px 0 0;\r\n color:var(--muted);\r\n font-size:14px;\r\n line-height:1.7;\r\n }\r\n .allinone-reels .rule{\r\n height:1px;\r\n background: linear-gradient(90deg, var(--gold), transparent);\r\n opacity:.7;\r\n margin-top:12px;\r\n }\r\n\r\n .allinone-reels .grid{\r\n display:grid;\r\n grid-template-columns: repeat(3, 1fr);\r\n gap:14px;\r\n margin-top:16px;\r\n }\r\n\r\n .allinone-reels .vcard{\r\n background: var(--card);\r\n border:1px solid rgba(0,0,0,.06);\r\n border-radius: 16px;\r\n overflow:hidden;\r\n box-shadow: 0 10px 26px rgba(0,0,0,.06);\r\n backdrop-filter: blur(6px);\r\n position:relative;\r\n }\r\n\r\n .allinone-reels .media{\r\n position:relative;\r\n background:#000;\r\n overflow:hidden;\r\n aspect-ratio: 9\/16; \/* \u76f4\u5f0f\u5f71\u7247\u6700\u9806 *\/\r\n }\r\n\r\n .allinone-reels video{\r\n width:100%;\r\n height:100%;\r\n object-fit: cover;\r\n display:block;\r\n background:#000;\r\n }\r\n\r\n .allinone-reels .badge{\r\n position:absolute;\r\n top:10px;\r\n left:10px;\r\n z-index:3;\r\n font-size:12px;\r\n padding:6px 10px;\r\n border-radius:999px;\r\n background: rgba(255,255,255,.82);\r\n border:1px solid rgba(0,0,0,.08);\r\n color: var(--ink);\r\n user-select:none;\r\n pointer-events:none;\r\n }\r\n\r\n .allinone-reels .sound{\r\n position:absolute;\r\n right:10px;\r\n bottom:10px;\r\n z-index:3;\r\n font-size:12px;\r\n padding:8px 10px;\r\n border-radius:999px;\r\n background: rgba(0,0,0,.55);\r\n border:1px solid rgba(255,255,255,.22);\r\n color:#fff;\r\n cursor:pointer;\r\n user-select:none;\r\n display:flex;\r\n align-items:center;\r\n gap:6px;\r\n }\r\n .allinone-reels .sound:active{ transform: scale(.98); }\r\n\r\n .allinone-reels .tap{\r\n position:absolute;\r\n inset:0;\r\n display:flex;\r\n align-items:center;\r\n justify-content:center;\r\n z-index:2;\r\n pointer-events:none;\r\n opacity:0;\r\n transition: opacity .25s ease;\r\n }\r\n .allinone-reels .tap span{\r\n background: rgba(0,0,0,.55);\r\n color:#fff;\r\n border:1px solid rgba(255,255,255,.18);\r\n padding:10px 12px;\r\n border-radius:999px;\r\n font-size:13px;\r\n letter-spacing:.04em;\r\n }\r\n .allinone-reels .vcard.is-paused .tap{ opacity:1; }\r\n\r\n .allinone-reels .cap{\r\n padding:10px 12px 12px;\r\n }\r\n .allinone-reels .cap b{\r\n display:block;\r\n font-size:14px;\r\n letter-spacing:.04em;\r\n margin-bottom:4px;\r\n }\r\n .allinone-reels .cap span{\r\n color:var(--muted);\r\n font-size:13px;\r\n line-height:1.6;\r\n display:block;\r\n }\r\n\r\n \/* \u624b\u6a5f \/ \u5e73\u677f *\/\r\n @media (max-width: 980px){\r\n .allinone-reels .grid{ grid-template-columns: repeat(2, 1fr); }\r\n }\r\n @media (max-width: 560px){\r\n .allinone-reels{ padding: 22px 16px 18px; }\r\n .allinone-reels .grid{ grid-template-columns: 1fr; }\r\n }\r\n<\/style>\r\n\r\n<section class=\"allinone-reels\" aria-label=\"\u5f71\u7247\u4f5c\u54c1\u5340\uff08Reels\u98a8\u683c\uff09\">\r\n <div class=\"head\">\r\n <div>\r\n <h3 class=\"title\">\u5f71\u7247\u4f5c\u54c1<\/h3>\r\n <p class=\"sub\">\u6ed1\u5230\u756b\u9762\u6703\u81ea\u52d5\u64ad\u653e\uff08\u975c\u97f3\uff09\uff0c\u6ed1\u8d70\u6703\u66ab\u505c\u3002\u60f3\u807d\u8072\u97f3\u6309\u53f3\u4e0b\u89d2\u300c\u8072\u97f3\u300d\u3002<\/p>\r\n <div class=\"rule\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"grid\" id=\"allinoneReelsGrid\">\r\n\r\n <!-- 02 (\u8b8a\u70ba\u7b2c\u4e00\u500b) -->\r\n <article class=\"vcard is-paused\">\r\n <div class=\"media\">\r\n <div class=\"badge\">AUTO \u2022 MUTED<\/div>\r\n <button class=\"sound\" type=\"button\" aria-label=\"\u5207\u63db\u8072\u97f3\">\ud83d\udd07 <span>\u8072\u97f3<\/span><\/button>\r\n <div class=\"tap\"><span>\u9ede\u4e00\u4e0b\u64ad\u653e \/ \u66ab\u505c<\/span><\/div>\r\n <video class=\"reel\" playsinline muted preload=\"metadata\" data-title=\"\u5f71\u7247 02\">\r\n <source src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/12\/IMG_0468-Converted-with-FlexClip.mp4\" type=\"video\/mp4\">\r\n <\/video>\r\n <\/div>\r\n <div class=\"cap\">\r\n <b>\u5f71\u7247 01<\/b>\r\n <span>\uff08\u53ef\u6539\u6210\uff1a\u7642\u7652\u5de5\u5177\uff0f\u5e36\u9818\u7bc0\u594f\uff0f\u7a7a\u9593\u6c1b\u570d\u2026\uff09<\/span>\r\n <\/div>\r\n <\/article>\r\n\r\n <!-- 03 (\u8b8a\u70ba\u7b2c\u4e8c\u500b) -->\r\n <article class=\"vcard is-paused\">\r\n <div class=\"media\">\r\n <div class=\"badge\">AUTO \u2022 MUTED<\/div>\r\n <button class=\"sound\" type=\"button\" aria-label=\"\u5207\u63db\u8072\u97f3\">\ud83d\udd07 <span>\u8072\u97f3<\/span><\/button>\r\n <div class=\"tap\"><span>\u9ede\u4e00\u4e0b\u64ad\u653e \/ \u66ab\u505c<\/span><\/div>\r\n <video class=\"reel\" playsinline muted preload=\"metadata\" data-title=\"\u5f71\u7247 03\">\r\n <source src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/12\/25041F52-336A-491F-B473-9190A4371E6D-Converted-with-FlexClip.mp4\" type=\"video\/mp4\">\r\n <\/video>\r\n <\/div>\r\n <div class=\"cap\">\r\n <b>\u5f71\u7247 02<\/b>\r\n <span>\uff08\u53ef\u6539\u6210\uff1a\u66fc\u9640\u7f85\uff0f\u8272\u5f69\u5275\u4f5c\u904e\u7a0b\u2026\uff09<\/span>\r\n <\/div>\r\n <\/article>\r\n\r\n <!-- 04 (\u8b8a\u70ba\u7b2c\u4e09\u500b) -->\r\n <article class=\"vcard is-paused\">\r\n <div class=\"media\">\r\n <div class=\"badge\">AUTO \u2022 MUTED<\/div>\r\n <button class=\"sound\" type=\"button\" aria-label=\"\u5207\u63db\u8072\u97f3\">\ud83d\udd07 <span>\u8072\u97f3<\/span><\/button>\r\n <div class=\"tap\"><span>\u9ede\u4e00\u4e0b\u64ad\u653e \/ \u66ab\u505c<\/span><\/div>\r\n <video class=\"reel\" playsinline muted preload=\"metadata\" data-title=\"\u5f71\u7247 04\">\r\n <source src=\"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/wp-content\/uploads\/2025\/12\/copy_4D6DD0CB-27A4-4319-A097-BC87C1A889C2-Converted-with-FlexClip-1.mp4\" type=\"video\/mp4\">\r\n <\/video>\r\n <\/div>\r\n <div class=\"cap\">\r\n <b>\u5f71\u7247 03<\/b>\r\n <span>\uff08\u53ef\u6539\u6210\uff1a\u8ab2\u5f8c\u56de\u994b\uff0f\u5b78\u54e1\u7247\u6bb5\u2026\uff09<\/span>\r\n <\/div>\r\n <\/article>\r\n\r\n <\/div>\r\n<\/section>\r\n\r\n<script>\r\n(() => {\r\n const cards = document.querySelectorAll('.allinone-reels .vcard');\r\n const vids = document.querySelectorAll('.allinone-reels video.reel');\r\n\r\n \/\/ \u9810\u8a2d\u975c\u97f3\uff08\u7b26\u5408\u624b\u6a5f\u81ea\u52d5\u64ad\u653e\u898f\u5247\uff09\r\n vids.forEach(v => {\r\n v.muted = true;\r\n v.playsInline = true;\r\n v.setAttribute('playsinline','');\r\n v.setAttribute('webkit-playsinline','');\r\n });\r\n\r\n \/\/ \u9ede\u5361\u7247\uff1a\u64ad\u653e\/\u66ab\u505c\uff08\u6392\u9664\u8072\u97f3\u6309\u9215\uff09\r\n cards.forEach(card => {\r\n const video = card.querySelector('video');\r\n const soundBtn = card.querySelector('.sound');\r\n\r\n card.addEventListener('click', (e) => {\r\n if (e.target.closest('.sound')) return;\r\n if (video.paused) {\r\n video.play().catch(()=>{});\r\n card.classList.remove('is-paused');\r\n } else {\r\n video.pause();\r\n card.classList.add('is-paused');\r\n }\r\n });\r\n\r\n \/\/ \u8072\u97f3\u6309\u9215\uff1a\u5207\u63db\u975c\u97f3\r\n soundBtn.addEventListener('click', (e) => {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n\r\n \/\/ \u53ea\u4fdd\u7559\u4e00\u652f\u5f71\u7247\u958b\u8072\u97f3\uff08\u66f4\u50cf reels\uff09\r\n vids.forEach(v => { if (v !== video) v.muted = true; });\r\n document.querySelectorAll('.allinone-reels .sound').forEach(btn=>{\r\n if (btn !== soundBtn) btn.innerHTML = '\ud83d\udd07 <span>\u8072\u97f3<\/span>';\r\n });\r\n\r\n video.muted = !video.muted;\r\n soundBtn.innerHTML = video.muted ? '\ud83d\udd07 <span>\u8072\u97f3<\/span>' : '\ud83d\udd0a <span>\u8072\u97f3<\/span>';\r\n if (!video.paused) video.play().catch(()=>{});\r\n });\r\n });\r\n\r\n \/\/ \u81ea\u52d5\u64ad\u653e\/\u66ab\u505c\uff1a\u6ed1\u5230\u756b\u9762\u64ad\u653e\uff08\u975c\u97f3\uff09\u6ed1\u8d70\u66ab\u505c\r\n const io = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n const card = entry.target;\r\n const video = card.querySelector('video');\r\n\r\n \/\/ \u770b\u5230 60% \u624d\u64ad\u653e\r\n if (entry.isIntersecting && entry.intersectionRatio >= 0.6) {\r\n vids.forEach(v => { if (v !== video) v.pause(); });\r\n cards.forEach(c => { if (c !== card) c.classList.add('is-paused'); });\r\n\r\n \/\/ \u9032\u5165\u8996\u7a97\u81ea\u52d5\u64ad\u653e\uff1a\u56fa\u5b9a\u975c\u97f3\uff08\u7b26\u5408\u898f\u5247\uff09\r\n video.muted = true;\r\n const btn = card.querySelector('.sound');\r\n if (btn) btn.innerHTML = '\ud83d\udd07 <span>\u8072\u97f3<\/span>';\r\n\r\n video.play().then(()=> {\r\n card.classList.remove('is-paused');\r\n }).catch(()=>{});\r\n } else {\r\n video.pause();\r\n card.classList.add('is-paused');\r\n }\r\n });\r\n }, { threshold: [0, 0.25, 0.6, 0.9] });\r\n\r\n cards.forEach(card => io.observe(card));\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Allinone Gallery Slider FEEL THIS MOMENT With the wonde […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":32,"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":759,"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/759"}],"wp:attachment":[{"href":"https:\/\/xn--allinone-6s9ny2y86kkj9i9xgs9e.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}