feat(首页头图): 孕25周换 v4 用户确认版——胎盘在囊顶、胎发、颜色回调 (v26093011)

- 素材换母婴作图 v4(用户已在作图会话确认画面):颜色比 v3 深一档(囊外 #DB8263~#E38E6E),
  胎盘移到囊顶、脐带从上方细细垂下、接肚子端被腿挡住;头部重画带细软胎发;浮动 ≤7px。
- 背景、囊视频按同一流程重做(囊心 667,368),视频 66KB;底色兜底改 #de8968。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-09-30 13:04:51 +00:00
parent bca92312f8
commit 62b23af323
7 changed files with 11 additions and 11 deletions

BIN
assets/img/471b07e27e77.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Binary file not shown.

View File

@@ -7,7 +7,7 @@
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>兜爸心选 · 孕育陪伴</title>
<!-- V:26093010 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<!-- V:26093011 缓存版本标记:改 css/js 时同步 bump 该值(与 js/app.js 的 VER 同源),静态资源按 mtime 走 ETag 自动刷新 -->
<link rel="stylesheet" href="mama-box.css">
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<!-- 共享助手:授权/跳商城/位置上报(分享卡片同步,见 docs/h5-auth-standard.md 第四节) -->
@@ -59,11 +59,11 @@
<section class="screen is-active" id="screen-home" data-screen="home">
<div class="home-hero">
<div class="petals" id="petals"></div>
<!-- 2026-09-30:宝宝不再是右上角一张圆形 PNG。头图背景 = 孕 25 周循环视频(母婴作图 v3,Q 版卡通)的第 1 帧,
<!-- 2026-09-30:宝宝不再是右上角一张圆形 PNG。头图背景 = 孕 25 周循环视频(母婴作图 v4)的第 1 帧,
这里只叠一段截了羊水囊的同源视频 .hero-kid:镜头固定、同一帧起步,所以和背景严丝合缝;
宝宝自己吸手指、蹬腿,囊和脐带(连在囊壁胎盘上)不动。视频放不起来就停在背景那一帧。 -->
宝宝自己吸手指、蹬腿,囊和囊顶胎盘不动(胎盘在遮罩羽化区,由背景那一帧显示)。视频放不起来就停在背景那一帧。 -->
<div class="hero-baby" aria-hidden="true">
<video class="hero-kid" id="heroKid" src="assets/video/af6b7493f5e0.mp4"
<video class="hero-kid" id="heroKid" src="assets/video/88680d066a73.mp4"
muted autoplay loop playsinline webkit-playsinline x5-playsinline
preload="auto" disablepictureinpicture></video>
<span class="hb-bub b1"></span><span class="hb-bub b2"></span><span class="hb-bub b3"></span>

View File

@@ -3,7 +3,7 @@
(function () {
'use strict';
/* 页面版本号(YYMMDD+序号):显示在「关于兜爸心选」页底部;bump 时同步 head 注释与 ?v= */
var VER = '26093010';
var VER = '26093011';
const $ = (s, c) => (c || document).querySelector(s);
const $$ = (s, c) => Array.from((c || document).querySelectorAll(s));

View File

@@ -191,10 +191,10 @@ a.skip:focus{left:16px;top:16px}
hero 橙色区底缘:中部 ≈y420(210) 两侧 ≈y340(170) → 椭圆下沿 44px
⚠️ 上面这些是**设计稿**的数,不是现在的实现值。设计稿里没有 slogan,
加进去之后品牌字以下整列都下移了,实际纵向排布以 .home-hero 里那笔账为准。 */
/* 2026-09-30 头图 = 孕 25 周(母婴作图 v3:Q 版卡通宝宝、浅暖桃底;无孕肚、镜头固定、脐带连囊壁胎盘)。
背景 assets/img/b1597f99dea7.jpg(1560×750 = 3 倍图 520×250)= 视频 yun25w-loop.mp4 第 1 帧缩到 .93,
/* 2026-09-30 头图 = 孕 25 周(母婴作图 v4,用户确认版:卡通宝宝带细软胎发、暖桃底;胎盘在囊顶,脐带从上方细细垂下;无孕肚、镜头固定)。
背景 assets/img/471b07e27e77.jpg(1560×750 = 3 倍图 520×250)= 视频 yun25w-loop.mp4 第 1 帧缩到 .93,
羊水囊中心摆在 (1250,375);视频左/上/下不够的地方按边缘色拉伸补齐并羽化。
图高钉死 = 橙区高、右对齐,屏宽 ≤520 都铺得满;再宽就露底色 #eaa485(=图左缘色)。
图高钉死 = 橙区高、右对齐,屏宽 ≤520 都铺得满;再宽就露底色 #de8968(=图左缘色)。
会动的宝宝是叠在上面的同源视频,见 .hero-baby。
上面叠一层很淡的暖色左深右透渐变,只为让左边白字(孕周环、天数卡)再稳一点。
形状(高度、底部椭圆弧)不变。 */
@@ -202,8 +202,8 @@ a.skip:focus{left:16px;top:16px}
position:relative;color:#fff;overflow:hidden;
background:
linear-gradient(90deg,rgba(150,55,35,.20) 0%,rgba(150,55,35,.07) 38%,rgba(150,55,35,0) 58%),
url(assets/img/b1597f99dea7.jpg) right center/auto 100% no-repeat,
#eaa485;
url(assets/img/471b07e27e77.jpg) right center/auto 100% no-repeat,
#de8968;
padding:env(safe-area-inset-top) 15px 0 16px;
/* 设计稿橙区 210px。但设计稿里气泡下缘是被白卡盖住的,
现在气泡补全成整圆(高 189.5),橙区必须够高才不会被 overflow:hidden 切掉。
@@ -293,7 +293,7 @@ a.skip:focus{left:16px;top:16px}
改 top 前先读 .home-hero 里那笔竖列账。 */
/* 定位和浮动都挂在外壳上,img 只负责铺满 —— 这样嘴边的泡泡是
相对气泡本身定位的,会跟着整幅画一起上下浮,而不是自己飘在原地 */
/* 会动的宝宝(2026-09-30):视频 assets/video/af6b7493f5e0.mp4 = 原片以囊心 (664,368) 截 660×660、缩到 400×400。
/* 会动的宝宝(2026-09-30):视频 assets/video/88680d066a73.mp4 = 原片以囊心 (667,368) 截 660×660、缩到 400×400。
原片本身是正放 5s + 倒放 5s,首尾同一帧,直接 loop 无缝。
摆位:背景里视频帧缩了 .93,这块 660 → 614 画布像素,左上角落在 (943,68),
换算成橙区高 H:宽高 614/750 = .8187H,顶 68/750 = .0907H,右 (1560−1557)/750 ≈ .004H。