Javascript 清洁编码的HTML文本冒险游戏
我正在使用HTML5、CSS和JavaScript构建一个基于文本的冒险游戏，但在我走得太远之前，我想知道我应该如何组织我的文件。我在想，在通过函数链接所有内容的同时，拥有多个用于事件和对象的.js文件会比拥有一个长HTML文档更好吗 我是从inform7（一个交互式文本游戏生成器）处理多个脚本的方式中得到这个想法的。可悲的是，i7没有提供一种通过网络浏览器进行游戏的方式，需要下载一个像Gluxle这样的解释器程序。其他如Twine2和Quest之类的if构建器很不错，但它们似乎非常有限 到目前为止，标题屏幕已经完成，我正要开始制作游戏内容Javascript 清洁编码的HTML文本冒险游戏,javascript,html,css,code-organization,Javascript,Html,Css,Code Organization,我正在使用HTML5、CSS和JavaScript构建一个基于文本的冒险游戏，但在我走得太远之前，我想知道我应该如何组织我的文件。我在想，在通过函数链接所有内容的同时，拥有多个用于事件和对象的.js文件会比拥有一个长HTML文档更好吗 我是从inform7（一个交互式文本游戏生成器）处理多个脚本的方式中得到这个想法的。可悲的是，i7没有提供一种通过网络浏览器进行游戏的方式，需要下载一个像Gluxle这样的解释器程序。其他如Twine2和Quest之类的if构建器很不错，但它们似乎非常有限 到目前
//JavaScript文档
//标题屏幕
函数淡出效果（）{
var fadeTarget=document.getElementById（“标题屏幕”）；
var fadeEffect=setInterval（函数（）{
如果（！fadeTarget.style.opacity）{
fadeTarget.style.opacity=1；
}
如果（fadeTarget.style.opacity>0）{
fadeTarget.style.opacity-=0.1；
}否则{
清除间隔（fadeEffect）；
}
}, 150);
}
document.getElementById（“开始”）.addEventListener（“单击”，淡出效果）；
//游戏屏幕
//L.窗口
//M.窗口
//右窗@charset“utf-8”；
/*CSS文档*/
身体{
背景色：#666；
字体系列：Roboto Mono；
字体大小：12px；
颜色：白色；
边缘顶部：20px；
}
/*标题屏幕CSS*/
.游戏屏幕{
背景色：#333；
保证金：自动；
填充：20px；
宽度：864px；
高度：504px；
文本对齐：居中；
盒影：0 0 7px#000000；
}
.版本{
字号：8px；
文本对齐：右对齐；
}
.游戏名称{
字体系列：Fondamento；
字体大小：40px；
文本阴影：0 0 3px#FFF；
动画：脉冲3s线性；
}
/*所有标题屏幕按钮动画*/
#开始{
动画：脉冲1s无限交替；
背景色：#333；
边界：无；
颜色：#FFF；
字体家族：继承；
字体大小：继承；
光标：指针；
}
.开始比赛{
显示：无；
}
/*以后添加
#新的{
动画：脉冲1s无限交替；
背景色：#333；
边界：无；
颜色：#FFF；
字体家族：继承；
字体大小：继承；
光标：指针；
显示：无；
}
#装载{
动画：脉冲1s无限交替；
背景色：#333；
边界：无；
颜色：#FFF；
字体家族：继承；
字体大小：继承；
光标：指针；
显示：无；
}
#退出{
动画：脉冲1s无限交替；
背景色：#333；
边界：无；
颜色：#FFF；
字体家族：继承；
字体大小：继承；
光标：指针；
显示：无；
}
*/
@关键帧脉冲{
0%{不透明度：0.1；}
100%{不透明度：1；文本阴影：0 0 3px#FFF；}
}
/*在游戏屏幕上*/
.游戏屏幕{
}
小鼠路径（试验）
0.1.0版[演示]
老鼠的路径
[开始]
《老鼠之路》是一部互动小说
达里尔·格雷
© 2020灰色艺术