根雕美女（套用黑黑老师的代码）
本帖最后由 梦江南 于 2025-8-11 19:49 编辑 <br /><br /><style>@import 'https://638183.freep.cn/638183/web/css/tz01.css';
#pa { --offsetX: 81px; --bg: url('https://img4.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140739901.png') no-repeat center/cover; --bg1: lightblue; --state: runnig; transition: 0.5s; --ma-size: 15%; --per: -2%; --a: 45deg; }
#pa::before { content: ''; position: absolute; inset: 0; background: var(--bg1); mask: linear-gradient(var(--a), red var(--per), transparent calc(var(--per) + 2%), transparent); }
#ma { left: 30px; top: 30px; background: url('https://img1.oldkids.cn/upload/2025/08/11/blog_260798238_20250811180847699.png') no-repeat center/cover; animation-duration: 12s; }
#btnFs { right: 20px; bottom: 20px; }
</style>
<div id="pa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2029214609" autoplay loop></audio>
<video class="qk-vid" src="https://video.699pic.com/videos/13/45/49/b_c2ZgPDjS52Ni1590134549_10s.mp4" autoplay loop muted></video>
<div id="ma" class="sepia"></div>
</div>
<script type="module">
import { FS } from 'https://638183.freep.cn/638183/web/js/fullscreen.js';
FS(pa, ma);
var per = -2, step = 0.5, aniCounter = 0, raf;
var pics = [
'https://img1.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140734500.png',
'https://img1.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140734199.png',
'https://img2.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140735997.png',
'https://img1.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140737602.png',
'https://img4.oldkids.cn/upload/2025/08/11/blog_260798238_20250811140739901.png'
];
ma.onanimationiteration = () => {
var angle = aniCounter % 4, picIdx = aniCounter % pics.length;
pa.style.setProperty('--a', `${45 + (angle * 90)}deg`);
pa.style.setProperty('--bg1', `url(${pics}) no-repeat center/cover`);
picIdx = (picIdx + 1) % pics.length;
aniCounter ++;
changePic();
};
ma.onmouseenter = () => pa.classList.add('grayscale');
ma.onmouseout = () => pa.classList.remove('grayscale');
function changePic() {
if (per > 100) {
cancelAnimationFrame(raf);
per = -2;
var picIdx = aniCounter % pics.length;
picIdx = picIdx > 0 ? picIdx - 1: pics.length - 1;
pa.style.setProperty('--bg', `url(${pics}) no-repeat center/cover`);
} else {
per += step;
pa.style.setProperty('--per', per + '%');
raf = requestAnimationFrame(changePic);
}
}
</script> 不知为什么，开始有空白。 根雕制作出这么好的人像真不容易。 梦油 发表于 2025-8-11 19:58
根雕制作出这么好的人像真不容易。
谢谢梦油欣赏，这是AI制作出来的。早上好！ 哇，这些根雕图好美啊，图片轮状也很正常。欣赏江南{:4_199:}好帖 梦江南 发表于 2025-8-11 19:49
不知为什么，开始有空白。
没感觉有空白啊，挺好的{:4_187:} 红影 发表于 2025-8-12 10:07
哇，这些根雕图好美啊，图片轮状也很正常。欣赏江南好帖
问好影子，全屏看效果更好。 红影 发表于 2025-8-12 10:12
没感觉有空白啊，挺好的
感觉开始时有几秒空白。 梦江南 发表于 2025-8-12 07:54
谢谢梦油欣赏，这是AI制作出来的。早上好！
好美！ 梦油 发表于 2025-8-12 14:18
好美！
谢谢，再赏。 AI图片制作的真好，欣赏了！
老谟深虑 发表于 2025-8-12 16:13
AI图片制作的真好，欣赏了！
谢谢老谟老师欣赏。祝秋安！ 梦江南 发表于 2025-8-11 19:49
不知为什么，开始有空白。
阿姨你这个图片是现成的连接还是自己上传的，png格式的图片文件比较大，我都是取出连接才看见图，你最好转换jpg格式而且要无损压缩一下，这样的图片文件很小，出来速度特别快 非常美的制作，现在可以正常出来了，刷新了几次，完美{:4_178:} 梦江南 发表于 2025-8-12 11:17
问好影子，全屏看效果更好。
人物和树根的设计都很美。 梦江南 发表于 2025-8-12 11:18
感觉开始时有几秒空白。
我没感觉到，挺好啊。 小辣椒 发表于 2025-8-12 22:20
阿姨你这个图片是现成的连接还是自己上传的，png格式的图片文件比较大，我都是取出连接才看见图，你最好 ...
看到小辣椒很高兴。问好小辣椒，我在AI做好后，再到PS里把图片水印去掉，把图片尺寸调整1080X720，再上传的。知道了，下次要把PNG格式导出为jpg格式。{:4_179:} 小辣椒 发表于 2025-8-12 22:21
非常美的制作，现在可以正常出来了，刷新了几次，完美
谢谢小辣椒告知，以后做起来要把格式转换为jpg格式。今天不好意思了。{:4_204:} 红影 发表于 2025-8-12 22:31
人物和树根的设计都很美。
这是要靠提示词来完成的。早上问好影子！{:4_204:} 红影 发表于 2025-8-12 22:32
我没感觉到，挺好啊。
您没感觉就好。