fc2ブログ

架空創造地図描画日記2023[No.7824]

 二つの未解決事項のうち、何はともあれハンバーガーのスマホタップができない問題を解決しないことには、その先へ進めないと判断した。従来はサンプルに従ってjqueryを用いていたが、どうせ動かないのだからjavascriptは使わずに、動作の軽いcssを用いたシステムに作り直すことにした。
 cssでハンバーガーメニューをやるには、inputのチェックボックスを非表示にして、外見を三本線のハンバーガーにして、見えていないチェックボックスに対してラベルで紐付するという方法がセオリーである。それについてはどのサンプルを参照しても記されているので、ここでダラダラと書くことはしない。ただ、スイッチのON/OFF切り替え後の制御が少々ややこしい。その術式は、#チェックボックスに付けたID名:checked~制御するクラス名 …でほぼ共通だが、今後のために覚えておく必要があるだろう。この「~」が今まで見慣れない術式でかなり苦労した。
 ハンバーガーの三本線と×印の切り替えは最初のサンプルを流用したが、どんなサンプルでも制御は共通しているだろう。三本線を真ん中に重ねて、1本は45度、1本を他の1本に重ねるか又は透明にして、残りの1本を-45度にすればよい。ちなみに45度回転の呪文はtransform:rotate(45deg)である。transformの呪文はメニューを出し入れする際や、動作に演出を持たせるためにも用いられる。
 今回は段階を踏んで、正常に動いたところでアップロードしながら、スマホで動作テストをするという流れで細かく進めることにした。かくして、三本線をタップして×印に変化するところまでは成功。未解決事項の一つはようやく解消された。

コメント

非公開コメント

管理人

ごとりん

  • 著者:ごとりん
  •  架空想像国家「月本國」の全国地図描画作業を地味に続けている貧乏クリエーター。このブログの毎日更新が途切れない限り、無事に生存しているものと関知して下さい。
Simulation Country GAPAN 月本國



 「月本國」では、2D-RPG向け現代和風素材の無償配布の他、開国(平成13年12月16日)~平成17年2月28日までの過去ログを扱っています。
「旧:月本国政府広報」
[No.1~1171]

 又、連載物「RPG制作雑記」「徒然なる200x裏技集」(↓のカテゴリーで★が付いているもの)等のwardファイル版過去ログを扱っています。このblogの過去ログが読みにくい場合は是非御利用下さい。

現代和風RPG「月影の駅」Ver2
 RPGツクール2000製フリーウェア。駅から始まり駅で終わる、オトナのドライな人間模様。
 ゲーム宣伝動画配信中!

「Made in GAPAN 歩 ~Ayumu~」
 2D-RPG向け歩行グラフィック合成ソフト。当局開発の32規格8方向部品セット他、一般的な部品セットも利用可能。各使用環境に合わせた既存素材の組み直しや、顔グラ等の合成もOK。
(上記の管理人画像はこれで合成したものです。)
ブログ内検索
カテゴリー(★:「月本國」にward版あり)
カレンダー
09 | 2023/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
月別アーカイブ
最近のコメント
最近のトラックバック
リンク
RSSフィード