だぶだぶノート

<img>など、タグ属性にwidth、heightを指定できる要素には、CSSでもwidth、heightを指定すると、そのCSSの方が優先される。

<style>
img { width: 120px; height: 120px }
</style>
<img src="poster.png" width="300" height="300">

表示例：

width、またはheightの一方をautoにすると、アスペクト比を固定して拡大する。

<style>
img { width: 120px; height: auto }
</style>
<img src="poster.png" width="300" height="300">

表示例：

しかし、<video>では少々事情が違うようだ。 Read_On

ゲームブックやノベルゲームにも使えそうなテンプレート、ProsemazeをGithubで公開しました。
AngularJSの特徴を掴み切れてないのでライブラリのメソッドで簡単に書ける物をわざわざ自作してるような部分がありそうですし、設計上のゴミが残ってると思いますが。

https://github.com/heporap/prosemaze
動作サンプル

パラメーター指定などはできませんが、ページ分岐で迷路っぽくはできます。
制作方法はシナリオをJSONで書くだけです。

なお、URL直入力するとページを表示できてしまうので、<iframe>でURLを隠しておく事をお勧めします。
それでもHTMLを解析すればバレバレですので、あまり厳格なゲームは作れません。

JSONファイルをXHRで読み込むだけなので、基本的にはサーバーは不要です。
そのため、Phonegapなどでアプリ化しても使えると思います。

あけましておめでとうございます。
今年もよろしくお願い致します。