jone/mama-box
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

首页广场 V6「测一测」三版（&qz=1/2/3）+ 对比页 demo/gch/qz.html

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
deploy
2026-11-02 03:46:49 +00:00
parent 7198dc769e
commit c239567524
6 changed files with 84 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
demo/gch/v6.js
View File

@@ -31,16 +31,32 @@
var foot = sec.querySelector('.g4-foot');
/* 两个测试：你是什么样的妈妈（已有 topic/ceshi）+ 你家准爸爸是哪种队友（新做 topic/duiyou） */
var QZ = [
{ href: 'topic/ceshi/', k: '妈妈类型', t: '你是什么样的妈妈？', n: '15.6万', img: 'topic/ceshi/img/hero.webp', c: '#7C5CFC', q1: '#F1ECFF', q2: '#E4DBFF', qs: 'rgba(124,92,252,.6)' },
{ href: 'topic/duiyou/', k: '队友类型', t: '准爸爸是哪种队友？', n: '8.3万', img: 'topic/duiyou/img/hero.webp', c: '#F07A2E', q1: '#FFF3E6', q2: '#FFE2C8', qs: 'rgba(240,122,46,.6)' }
{ href: 'topic/ceshi/', k: '妈妈类型', t: '你是什么样的妈妈？', n: '15.6万', img: 'topic/ceshi/img/hero.webp', pos: '42% 22%', who: '测你', c: '#7C5CFC', q1: '#F1ECFF', q2: '#E4DBFF', qs: 'rgba(124,92,252,.6)' },
{ href: 'topic/duiyou/', k: '队友类型', t: '准爸爸是哪种队友？', n: '8.3万', img: 'topic/duiyou/img/hero.webp', pos: '58% 24%', who: '测他', c: '#F07A2E', q1: '#FFF3E6', q2: '#FFE2C8', qs: 'rgba(240,122,46,.6)' }
];
var qz = document.createElement('div');
qz.className = 'g6-qz';
qz.innerHTML = '<div class="g6-qh">测一测<small>1 分钟，看看你和他</small></div><div class="g6-qr">' + QZ.map(function (q) {
return '<a class="g6-q ripple" href="' + esc(q.href + location.search + location.hash) + '">' +
'<img src="' + esc(q.img) + '" alt="" loading="lazy">' +
'<span class="g6-qb"><b class="g6-qt">' + esc(q.t) + '</b><span class="g6-qf"><span>' + q.n + ' 人测过</span><span class="g6-qg">开始测 ›</span></span></span></a>';
}).join('') + '</div>';
/* 11-02 用户：「测一测出三版让我选」→ 地址 &qz=1/2/3 切换：1 插画白卡（默认）/ 2 小胶囊 / 3 你&他合体卡 */
var QV = (location.search.match(/[?&]qz=([1-3])/) || [])[1] || '1';
var qz = document.createElement('div'), lk = function (q) { return esc(q.href + location.search + location.hash); };
qz.className = 'g6-qz qv' + QV;
var hd = '<div class="g6-qh">测一测<small>1 分钟，看看你和他</small></div>';
if (QV === '1') {
qz.innerHTML = hd + '<div class="g6-qr">' + QZ.map(function (q) {
return '<a class="g6-q ripple" href="' + lk(q) + '">' +
'<img src="' + esc(q.img) + '" alt="" loading="lazy">' +
'<span class="g6-qb"><b class="g6-qt">' + esc(q.t) + '</b><span class="g6-qf"><span>' + q.n + ' 人测过</span><span class="g6-qg">开始测 ›</span></span></span></a>';
}).join('') + '</div>';
} else if (QV === '2') {
qz.innerHTML = hd + '<div class="g6-qr">' + QZ.map(function (q) {
return '<a class="g6-c ripple" href="' + lk(q) + '"><img src="' + esc(q.img) + '" alt="" loading="lazy" style="object-position:' + q.pos + '">' +
'<span class="g6-cb"><b>' + esc(q.t) + '</b><small>' + q.n + ' 人测过</small></span><i>›</i></a>';
}).join('') + '</div>';
} else {
qz.innerHTML = hd + '<div class="g6-v"><div class="g6-vr">' + QZ.map(function (q, i) {
return (i ? '<span class="g6-amp">&amp;</span>' : '') +
'<a class="g6-vc ripple" href="' + lk(q) + '"><img src="' + esc(q.img) + '" alt="" loading="lazy" style="object-position:' + q.pos + '">' +
'<small>' + q.who + '</small><b>' + esc(q.t) + '</b><em>开始测 ›</em></a>';
}).join('') + '</div><p class="g6-vf">两个都测完，看看你们是哪种组合 · 已有 23.9万 人测过</p></div>';
}
sec.insertBefore(qz, foot);
sec.insertBefore(box, foot);
var list = box.querySelector('.g6-list'), all = box.querySelector('.g6-all');