八叶莲华会社:修订间差异
第1行: | 第1行: | ||
{{ | <html lang="zh-CN"> | ||
<head> | |||
<meta charset="UTF-8"> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |||
<title>八叶莲华会社</title> | |||
<style> | |||
/* 基础样式重置 */ | |||
* { | |||
margin: 0; | |||
padding: 0; | |||
box-sizing: border-box; | |||
} | |||
body { | |||
font-family: "Noto Sans SC", "Microsoft YaHei", sans-serif; | |||
} | |||
/* 动画容器 (全屏背景) */ | |||
.intro-container { | |||
position: fixed; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
background: radial-gradient(ellipse at center, rgba(34, 34, 34, 0.9) 0%, rgba(10, 10, 10, 0.98) 100%); | |||
z-index: 9999; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
opacity: 0; | |||
transition: opacity 1.2s cubic-bezier(0.4, 0, 0.2, 1); | |||
} | |||
/* 花瓣装饰背景 */ | |||
.petals-background { | |||
position: absolute; | |||
width: 100%; | |||
height: 100%; | |||
opacity: 0.15; | |||
pointer-events: none; | |||
} | |||
.petal { | |||
position: absolute; | |||
background: rgba(255, 255, 255, 0.6); | |||
border-radius: 50% 50% 50% 0; | |||
width: 20px; | |||
height: 20px; | |||
opacity: 0; | |||
animation: fallDown 15s linear infinite; | |||
} | |||
@keyframes fallDown { | |||
0% { | |||
transform: translateY(-100px) rotate(0deg); | |||
opacity: 0; | |||
} | |||
10% { | |||
opacity: 0.6; | |||
} | |||
90% { | |||
opacity: 0.4; | |||
} | |||
100% { | |||
transform: translateY(100vh) rotate(360deg); | |||
opacity: 0; | |||
} | |||
} | |||
/* 进度条 */ | |||
.progress-container { | |||
position: absolute; | |||
bottom: 60px; | |||
left: 50%; | |||
transform: translateX(-50%); | |||
width: 280px; | |||
height: 3px; | |||
background: rgba(255, 255, 255, 0.2); | |||
border-radius: 4px; | |||
overflow: hidden; | |||
} | |||
.progress-bar { | |||
height: 100%; | |||
width: 0%; | |||
background: linear-gradient(90deg, #a17f3a, #d6b161, #a17f3a); | |||
border-radius: 4px; | |||
transition: width 0.3s ease; | |||
} | |||
/* 动画内容区 */ | |||
.intro-content { | |||
text-align: center; | |||
filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.15)); | |||
position: relative; | |||
} | |||
/* LOGO样式和动画 */ | |||
.intro-logo { | |||
max-width: 180px; | |||
height: auto; | |||
display: block; | |||
margin: 0 auto 25px; | |||
opacity: 0; | |||
transform: translateY(20px) scale(0.9); | |||
transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1); | |||
border-radius: 50%; | |||
padding: 10px; | |||
background: radial-gradient(ellipse at center, rgba(161, 127, 58, 0.2) 0%, transparent 70%); | |||
} | |||
/* 标题文字样式和动画 */ | |||
.intro-title { | |||
color: #FFFFFF; | |||
font-size: 3.2em; | |||
font-weight: 500; | |||
text-shadow: 0 0 10px rgba(255, 255, 255, 0.3), 0 0 20px rgba(0, 0, 0, 0.5); | |||
letter-spacing: 3px; | |||
margin-bottom: 10px; | |||
opacity: 0; | |||
transform: scale(0.95); | |||
transition: all 1.5s cubic-bezier(0.23, 1, 0.32, 1); | |||
} | |||
/* 副标题 */ | |||
.intro-subtitle { | |||
color: rgba(255, 255, 255, 0.7); | |||
font-size: 1.2em; | |||
font-weight: 300; | |||
letter-spacing: 2px; | |||
margin-top: 10px; | |||
opacity: 0; | |||
transform: translateY(10px); | |||
transition: all 1.2s cubic-bezier(0.23, 1, 0.32, 1) 0.6s; | |||
} | |||
/* 控制按钮 */ | |||
.intro-controls { | |||
position: absolute; | |||
bottom: 20px; | |||
right: 20px; | |||
display: flex; | |||
gap: 10px; | |||
} | |||
.control-btn { | |||
background: rgba(255, 255, 255, 0.1); | |||
border: none; | |||
color: white; | |||
padding: 8px 15px; | |||
border-radius: 20px; | |||
cursor: pointer; | |||
font-size: 0.9em; | |||
transition: all 0.3s ease; | |||
backdrop-filter: blur(5px); | |||
} | |||
.control-btn:hover { | |||
background: rgba(255, 255, 255, 0.2); | |||
} | |||
/* 花瓣装饰 */ | |||
.decoration { | |||
position: absolute; | |||
width: 100px; | |||
height: 100px; | |||
opacity: 0.1; | |||
pointer-events: none; | |||
} | |||
.decoration-1 { | |||
top: 20%; | |||
left: 15%; | |||
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,0 C60,20 80,30 100,50 C80,60 60,80 50,100 C40,80 20,60 0,50 C20,30 40,20 50,0Z" fill="%23d6b161"/></svg>') no-repeat center; | |||
background-size: contain; | |||
animation: float 12s ease-in-out infinite; | |||
} | |||
.decoration-2 { | |||
bottom: 20%; | |||
right: 15%; | |||
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,0 C60,20 80,30 100,50 C80,60 60,80 50,100 C40,80 20,60 0,50 C20,30 40,20 50,0Z" fill="%23a17f3a"/></svg>') no-repeat center; | |||
background-size: contain; | |||
animation: float 15s ease-in-out infinite reverse; | |||
} | |||
@keyframes float { | |||
0%, 100% { transform: translateY(0) rotate(0deg); } | |||
50% { transform: translateY(-20px) rotate(10deg); } | |||
} | |||
/* === 动画触发类 === */ | |||
.intro-container.is-active .intro-logo { | |||
opacity: 1; | |||
transform: translateY(0) scale(1); | |||
transition-delay: 0.2s; | |||
} | |||
.intro-container.is-active .intro-title { | |||
opacity: 1; | |||
transform: scale(1); | |||
transition-delay: 0.4s; | |||
} | |||
.intro-container.is-active .intro-subtitle { | |||
opacity: 1; | |||
transform: translateY(0); | |||
} | |||
/* 响应式设计 */ | |||
@media (max-width: 768px) { | |||
.intro-title { font-size: 2.2em; } | |||
.intro-subtitle { font-size: 1em; } | |||
.intro-logo { max-width: 130px; } | |||
.progress-container { width: 200px; } | |||
.control-btn { padding: 6px 12px; font-size: 0.8em; } | |||
} | |||
@media (max-width: 480px) { | |||
.intro-title { font-size: 1.8em; letter-spacing: 1px; } | |||
.intro-subtitle { font-size: 0.9em; letter-spacing: 1px; } | |||
.intro-logo { max-width: 100px; } | |||
.progress-container { width: 180px; bottom: 50px; } | |||
.control-btn { padding: 5px 10px; font-size: 0.7em; } | |||
.intro-controls { bottom: 15px; right: 15px; } | |||
} | |||
</style> | |||
</head> | |||
<body> | |||
<div id="intro-container" class="intro-container"> | |||
<div class="petals-background" id="petals-container"></div> | |||
<div class="decoration decoration-1"></div> | |||
<div class="decoration decoration-2"></div> | |||
<div class="intro-content"> | |||
<img src="https://soka.cafe/images/b/b3/%E5%85%AB%E5%8F%B6%E8%8E%B2%E5%8D%8E%E4%BC%9A%E7%A4%BE.jpg" alt="八叶莲华会社" class="intro-logo"> | |||
<h1 class="intro-title">八叶莲华会社</h1> | |||
<p class="intro-subtitle">“中华Air本文化的活化石,了解Air本文化的最好途径”</p> | |||
</div> | |||
<div class="progress-container"> | |||
<div class="progress-bar" id="progress-bar"></div> | |||
</div> | |||
<div class="intro-controls"> | |||
<button class="control-btn" id="skip-btn">跳过</button> | |||
<button class="control-btn" id="mute-btn">🔊</button> | |||
</div> | |||
</div> | |||
<script> | |||
document.addEventListener('DOMContentLoaded', function() { | |||
const container = document.getElementById('intro-container'); | |||
const progressBar = document.getElementById('progress-bar'); | |||
const skipBtn = document.getElementById('skip-btn'); | |||
const muteBtn = document.getElementById('mute-btn'); | |||
const petalsContainer = document.getElementById('petals-container'); | |||
// --- MODIFIED: Replaced oscillator with Audio element --- | |||
let backgroundAudio; | |||
let isMuted = false; | |||
let animationDuration = 4500; // 动画总时长(毫秒) | |||
let animationTimer; | |||
// 创建花瓣背景 | |||
function createPetals() { | |||
const petalCount = 15; | |||
for (let i = 0; i < petalCount; i++) { | |||
const petal = document.createElement('div'); | |||
petal.classList.add('petal'); | |||
const size = Math.random() * 15 + 10; | |||
petal.style.width = `${size}px`; | |||
petal.style.height = `${size}px`; | |||
petal.style.left = `${Math.random() * 100}%`; | |||
petal.style.animationDelay = `${Math.random() * 10}s`; | |||
petal.style.animationDuration = `${Math.random() * 10 + 10}s`; | |||
petal.style.transform = `rotate(${Math.random() * 90}deg)`; | |||
petal.style.background = `rgba(214, 177, 97, ${Math.random() * 0.5 + 0.3})`; | |||
petalsContainer.appendChild(petal); | |||
} | |||
} | |||
// --- REPLACED: Function now loads and plays the MP3 file --- | |||
function createSound() { | |||
try { | |||
const audioURL = 'https://soka.cafe/images/7/7a/Ambient-piano-logo-165357.mp3'; | |||
backgroundAudio = new Audio(audioURL); | |||
backgroundAudio.volume = 0.8; // Set initial volume | |||
backgroundAudio.play(); | |||
// Set up automatic fade out at the end of the animation | |||
setTimeout(fadeOutAndStop, animationDuration - 1200); | |||
} catch (e) { | |||
console.error('Error creating or playing audio:', e); | |||
} | |||
} | |||
// --- ADDED: New function to fade out the audio smoothly --- | |||
function fadeOutAndStop() { | |||
if (!backgroundAudio) return; | |||
const fadeDuration = 1200; // 1.2 seconds | |||
const fadeInterval = 50; // ms | |||
const volumeDecrement = backgroundAudio.volume / (fadeDuration / fadeInterval); | |||
const fade = setInterval(() => { | |||
let currentVolume = backgroundAudio.volume - volumeDecrement; | |||
if (currentVolume > 0) { | |||
backgroundAudio.volume = currentVolume; | |||
} else { | |||
backgroundAudio.volume = 0; | |||
backgroundAudio.pause(); | |||
clearInterval(fade); | |||
} | |||
}, fadeInterval); | |||
} | |||
// --- MODIFIED: This function now controls the new audio element --- | |||
function skipAnimation() { | |||
document.body.style.overflow = ''; | |||
clearTimeout(animationTimer); | |||
// Fade out audio if it's playing | |||
if (backgroundAudio) { | |||
fadeOutAndStop(); | |||
} | |||
container.style.opacity = '0'; | |||
setTimeout(() => { | |||
container.style.display = 'none'; | |||
}, 1200); | |||
} | |||
// --- MODIFIED: This function now controls the new audio element --- | |||
function toggleMute() { | |||
if (!backgroundAudio) return; // Don't do anything if audio hasn't been created | |||
isMuted = !isMuted; | |||
backgroundAudio.muted = isMuted; | |||
muteBtn.textContent = isMuted ? '🔇' : '🔊'; | |||
} | |||
// 初始化 | |||
function init() { | |||
document.body.style.overflow = 'hidden'; | |||
createPetals(); | |||
requestAnimationFrame(() => { | |||
container.style.opacity = '1'; | |||
container.classList.add('is-active'); | |||
let progress = 0; | |||
const interval = 30; | |||
const increments = interval / animationDuration * 100; | |||
const progressInterval = setInterval(() => { | |||
progress += increments; | |||
progressBar.style.width = `${progress}%`; | |||
if (progress >= 100) { | |||
clearInterval(progressInterval); | |||
} | |||
}, interval); | |||
// --- MODIFIED: The click listener now creates the MP3 sound --- | |||
document.body.addEventListener('click', function() { | |||
if (!backgroundAudio) { // Only create sound once | |||
createSound(); | |||
} | |||
}, { once: true }); | |||
}); | |||
animationTimer = setTimeout(skipAnimation, animationDuration); | |||
skipBtn.addEventListener('click', skipAnimation); | |||
muteBtn.addEventListener('click', toggleMute); | |||
} | |||
init(); | |||
}); | |||
</script> | |||
</body> | |||
</html> | |||
{{主题-创价旗}} | |||
{{信息 | {{信息 | ||
|标题=八叶莲华会社 | |标题=八叶莲华会社 |
2025年8月30日 (六) 06:54的版本

八叶莲华会社
“中华Air本文化的活化石,了解Air本文化的最好途径”
八叶莲华会社 | ||
---|---|---|
![]() | ||
团体信息 | ||
名称 |
中文:八叶莲华会社 | |
别名 |
八叶莲华音MAD社 | |
势力 |
300余名成员 | |
会长 |
||
设立者 |
||
设立时间 |
2021年07月15日 | |
关联 |
||
目前状态 |
半活跃 | |
八叶莲华会社,原名八叶莲华音MAD公社,是一个活跃在国内的大规模创价学会主题创作生产团体。成立于2021年07月15日,前身为久本诞生祭'21合作群,后正式改组为音mad社团。
在经历了数年的曲折发展后,八叶莲华会社成为了目前国内最大的、以创价学会二次创作为主题的音mad社团。
问:为什么八社社友人均扶她?
答:因为“会社”但没有“公”
历史
八叶莲华会社,初期为创价中文维基群组的附属组织(管理人员、主要群友基本是同一批人),后由于不断地主催一系列创价学会相关合作,以及其他相关组织的衰落(维基群爆了、信浓町公司爆了、老群不断失去活力),逐步成长至今日之规模。
2023年9月3日,由于原社长庞之梦因个人原因无法再进行管理工作,现社长铃鸣万魔殿接替其担任社长,后将社团名称正式改为“八叶莲华会社”,担任了一系列合作的主催并创立了本站点。希望在他的带领下,八叶莲华会社乃至整个创价圈能够更加具有活力。
合作作品
合作名称 | 发布日期 | 主催 | 地址 | 类型 | 使用曲目 |
---|---|---|---|---|---|
【合作】2021久本入信祭 ~ 信仰の歓びが胸いっぱいに広がります ~【金组】 | 2021-09-28 | 油饼菌、Sokayang、pe771537 | BV13M4y1374Q | 自由合作 | 无 |
【东方头破七分合作】久本投稿祭'21 ~Touhou Cult Medley ~ | 2021-11-30 | 庞之夢、Binguo55 | BV1Pf4y1T7xB | 组曲合作 | BV1ns411v7EH |
【东方头破七分合作】久本投稿祭'22 ~Touhou Cult Medley 2nd~ | 2022-11-30 | Binguo55 | BV1Rd4y187Zw} | 组曲合作 | BV1wx411677N |
【东方头破七分合作】久本投稿祭'23 ~Touhou Cult Medley 3rd~ | 2023-11-30 | 稀神灵梦、Binguo55 | BV1vQ4y1x7a4 | 组曲合作 | BV1ns411v7EH |
【合作】宗教都市祭 ~ Shukyo City Festival | 2024-11-30 | 铃鸣万魔殿、A787a、稀神灵梦、Binguo551 | BV1eXSMYVEcc | 组曲合作 | RB Suite of Trihydrate(自制) |
争议
群名之争
2023年9月现社长上位后为了更好的体现本团体的综合性及庞大性,将群名由"八叶莲华音MAD公社"先后更改为"八叶莲华音MAD社"、"八叶莲华会社"。一些老成员认为,旧群名更能体现社团的特色,并且贸然更改群名可能造成一些不必要的混乱,因此坚决要求保留原群名,因此引发了一系列的争议。后来甚至在群内进行了一次投票。
在此之后,群名虽时有更改,但基本保持不变
社团冲突
2024年08月13日,一名八社群友发现由信浓町唱片公司主催的久本诞生祭'24合作评论区遭到关闭,在八社群内了解情况后对这种行为进行了批判,而该社社长则亲自出面进行辩驳,导致群内出现一定程度的混乱。
后经群管理进行调解后其重新开启评论区并主动退出群聊,事件告一段落。
成员
管理
こばと(铃鸣万魔殿)、Binguo55、EM丶小陈、未来LK、Microsoft巨硬、南无妙法莲华经、Niwango公司、星星辰er、小黑、稀神灵梦、忆魂
核心成员
SYLVASTER、屑无名QAQ、6661555、笔、蓝色火焰AoiHonoo、sm1654231、sdjh二代目、Pigeon某人、-新世纪摆烂战士_、Sokayang、WHEELLTY、私绫伍、A787a、Kirby、tehOnisparta、mumu233、sdjh二代目、池田大作(复活版)、一yee而过、蓝色火焰AoiHonoo、大骗子不吃p、堕の皇、SGE、陈Yuyue、Pigeon鸽子、Aray、Hiizo、Krinpt、Delosha
主要成员
庞之梦、香辣鸡腿堡、Aisi、我在B站你给带路、小吉祥滑稽、阿包菜、夜神月、怪人十三面相、梦迦、六时夜、小鹰胡鸠、木大的雷某、LP3790、Air屎、704、亿坨空气、小峰、Sauta、ネズミ姉貴、红晨君、Taskschd、不可视久本、芙兰朵露、夜神月、陈俊逸同学、Abukuma_破晓、야투메아나、创价维基看板娘、Twachtman、梦迦、Skyeens De. Iealler、4点共圆、DJFRG、創世、驹草JX、雨墨祈祷、水興Mizoki、东风股早苗、RWKF、gra、2077