百宝箱:列表底部加查看更多三入口,三张卡按钮扫光提示可点
This commit is contained in:
19
js/kit.js
19
js/kit.js
@@ -27,6 +27,11 @@
|
||||
var FIRE = '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12.6 2.5c.4 3-1.6 4.6-3 6.2C8 10.4 7 12 7 14.3A5 5 0 0012 19.5a5 5 0 005-5.2c0-2-1-3.6-1.9-4.6-.2 1.3-.9 2.2-1.9 2.6.6-3.4-.2-7-.6-9.8z" fill="currentColor"/></svg>';
|
||||
|
||||
/* ---------- 上:三个入口 ---------- */
|
||||
var KN_IC = {
|
||||
qz: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 3h6M10 3v6l-5 9a2 2 0 001.8 3h10.4a2 2 0 001.8-3l-5-9V3" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
qa: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5h16v11H9l-5 4z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="M10 9.5a2 2 0 113 1.7c-.6.4-1 .8-1 1.5M12 14.5h.01" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>',
|
||||
js: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="3" width="14" height="18" rx="2.5" fill="none" stroke="currentColor" stroke-width="2"/><path d="M8.5 7h7M8.5 12h.01M12 12h.01M15.5 12h.01M8.5 16h.01M12 16h.01M15.5 16h.01" stroke="currentColor" stroke-width="2.2" stroke-linecap="round"/></svg>'
|
||||
};
|
||||
var E = [
|
||||
/* 11-04 用户:三个入口顺序改为 孕期百问 → 孕期计算器 → 趣味小测试 */
|
||||
{ k: 'qa', n: '孕期百问', d: '孕妈最常问的问题,一次看明白', c: '100 个问题', img: 'kepu', u: '人看过' },
|
||||
@@ -39,7 +44,12 @@
|
||||
'<b>' + x.n + '</b><span>' + x.d + '</span><strong class="kit-n">' + FIRE + '<i>--</i>' + x.u + '</strong><em>' + x.c + '<i aria-hidden="true">›</i></em></button>';
|
||||
}).join('') + '</div>' +
|
||||
/* 11-03 用户:「『大家都在用』跟百宝箱像两块,割裂了」→ 去掉这个小标题和虚线,三个入口 + 6 条装进同一张白底面板(.kit-pn),一眼看出是百宝箱里的内容 */
|
||||
'<div class="ms-list kit-list"></div></div>';
|
||||
'<div class="ms-list kit-list"></div>' +
|
||||
/* 11-05 用户:「大家不知道三个按钮能点,看完 6 条以为有『查看更多』,可又没有综合页」→ 列表底部加一排「查看更多」,
|
||||
按类型分三颗胶囊直达三个列表页(颜色、图标和上面三张卡一一对应),上面三张卡的按钮加一道定时扫光提示可点 */
|
||||
'<div class="kit-mo"><span>查看更多</span>' + E.map(function (x) {
|
||||
return '<button type="button" class="kit-mb m-' + x.k + '" data-k="' + x.k + '">' + KN_IC[x.k] + x.n.replace(/^孕期|^趣味小/, '') + '<i aria-hidden="true">›</i></button>';
|
||||
}).join('') + '</div></div>';
|
||||
sec.classList.remove('hide');
|
||||
function setCnt(k, t) { var e = box.querySelector('.e-' + k + ' em'); if (e) e.firstChild.nodeValue = t; }
|
||||
function setNum(k, n) { var e = box.querySelector('.e-' + k + ' .kit-n i'); if (e && n) e.textContent = wanX(n); }
|
||||
@@ -122,11 +132,6 @@
|
||||
var KR_GO = { qz: '去测', qa: '去看', js: '去算' };
|
||||
/* 11-04 用户:「前面的小图标换成字:测试用『测』、百问用『问』、计算器用『算』」(KN_IC 线稿图标留着备用) */
|
||||
var KR_CH = { qz: '测', qa: '问', js: '算' };
|
||||
var KN_IC = {
|
||||
qz: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M9 3h6M10 3v6l-5 9a2 2 0 001.8 3h10.4a2 2 0 001.8-3l-5-9V3" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
||||
qa: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M4 5h16v11H9l-5 4z" fill="none" stroke="currentColor" stroke-width="2" stroke-linejoin="round"/><path d="M10 9.5a2 2 0 113 1.7c-.6.4-1 .8-1 1.5M12 14.5h.01" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>',
|
||||
js: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="5" y="3" width="14" height="18" rx="2.5" fill="none" stroke="currentColor" stroke-width="2"/><path d="M8.5 7h7M8.5 12h.01M12 12h.01M15.5 12h.01M8.5 16h.01M12 16h.01M15.5 16h.01" stroke="currentColor" stroke-width="2.2" stroke-linecap="round"/></svg>'
|
||||
};
|
||||
function paint() {
|
||||
nums();
|
||||
var d = rows(), L = box.querySelector('.kit-list');
|
||||
@@ -245,7 +250,7 @@
|
||||
paint();
|
||||
|
||||
box.addEventListener('click', function (e) {
|
||||
var b = e.target.closest('.kit-e'); if (!b) return;
|
||||
var b = e.target.closest('.kit-e,.kit-mb'); if (!b) return;
|
||||
try { navigator.vibrate && navigator.vibrate(8); } catch (x) {}
|
||||
var k = b.dataset.k;
|
||||
if (k === 'qz') location.href = 'guangchang/' + cleanQ({ c: 'ceshi' });
|
||||
|
||||
Reference in New Issue
Block a user