ビルダー用メニュー画面内のボタン位置を調整する方法の備忘録。
今回も突発で、ビルダー用メニュー画面内のボタン位置を調整する方法の備忘録行きます。
ビルダーの機能では、デフォルトのメニューが入っており、任意のメニューボタンを非表示にすることが出来ます。
その時ボタンの位置は自動で調整が入りますが、ボタン配置が偏って見えて気に入らない……という場合も。
少し偏って見える?
ビルダーの機能では細かい調整が出来ないようなので、今回はhtmlをエディタで開いて触って、直接ボタンの位置を指定してみます。
※自分はhtmlを触るのに「Visual Studio Code」という無料のソースコードエディタを使いました。
エディタDLページ↓
https://code.visualstudio.com/Download
①ビルダーにて
myproject>作品名>tyrano>html内のmenu.html
を探して、menu.htmlをエディタで開きます。
エディタで見た画面。
現在ビルダーの機能でウィンドウクローズ(テキスト枠消去)が消えている状態になります。
そして、オブジェクトのサイズだけが指定されている状態です。
以下はセーブの部分の記述です。
<div class="menu_item ">
<a href="javascript:void(0)"><img class="menu_save" src="tyrano/images/system/menu_button_save.png" style="width: 520px;"></a>
</div>
ここに、位置の指定を書き加えます。
②styleに「position: absolute」を入れて、「オブジェクトの位置を絶対値で指定」します。
高さはtop、横位置はleft、単位はpxでボタンの位置を指定します。
<div class="menu_item" style="position: absolute;top: 100px;left: 0px;width: 100%;">
<a href="javascript:void(0)"><img class="menu_save" src="tyrano/images/system/menu_button_save.png" style="width: 520px;"></a>
</div>
今回は横位置を全て0.縦位置をそれぞれsave100px,load220px,menu_skip340px,menu_back_title460pxで指定しました。
サイズは100%です。
表示してみるとこんな感じに。
バランス良くなったでしょうか。位置の数値は好みで調整して下さい。
応用で戻るボタン等も任意の場所に移動出来ますが……今回はここまで。
ではまたしても駆け足でしたが、グッドラック!
フォロワー以上限定無料
絵が進まない。
無料