Slider

帰省2日目です。

静岡らしいもの食べたよ。

生しらすや黒はんぺんとかね。

.

スマホ用ページで画像をスライドさせたいなあとおもい

参考コードを探したのだけれども

なかなかコードが長くて疲れてしまったので

JSは使わずにHTMLとCSSだけで動くものを見つけて

そちらを参考にしました。

できたものがこちら

動くのでスマホから下記ページを見てみてね。

https://suwa3.github.io

.

コードをコピペして

画像をちょろっと変更しただけなので

こちらは数十分で完成したの。

.

でも、動きがあるからか

SNSへ投稿したとき

こっちのほうが10倍くらい反応あって

やはり動きがあると違うのだなあとおもった。

.

昨日の編集には3時間溶かしたわりに

反応の有無という意味では

費用対効果が少なかったかもしれない。

.

しかし、デベロッパーツールの使い方を再確認できた点では

成果が大きかったので良しだよ。

デベロッパーツール

HPのスマホ用ページを編集したの。

ハンバーガーメニュー持て余していたので。

.

移動時間にスマホ用ページのデザイン集を見つつ

スプリングボードメニューが見やすそうだなあとおもい

下記ページを参考にしつつ作りました。

https://gardenplace.jp/

(実際にはリンクを並べる形なのだけれども)

.

まずデベロッパーツールの使い方を調べるのに1時間。

基本的な使い方ふわっと分かっていたので

とりあえず欲しい場所のHTMLタグから

対応しているStyleを

自分のHPの既存内容と喧嘩しないようにコピペして

ひたすら貼り付ける作業に2時間。

計3時間かけて

上画像から下画像に編集しなおしました。

.

高校生のころ、毎日

「今日はこのHTMLタグで遊ぼう」

ってノリでWeb編集していたけれども

当時はデベロッパーツールとかなかったの。

改めて、これめちゃ便利だね。

PCでF12押すだけで参考にできるの強い。

.

静岡に帰省しました。

1泊2日なの。

従兄弟が大学で材料系と機械系について学んでいると知り

Linuxやラズパイ周辺のことなど

いろいろと話せたので楽しかった。

Maintenance

メンテナンスページつくったの。

適当なサイトの例をコピペして

色とか文とかいじってみた。

Hpをつくっていて

構造ガン無視し過ぎてfooterが一番上にきてしまっている図です。

動画のチュートリアルを粛々と観ていたのだけれども

「自分のつくりたいようにつくりたーい」

って自分でデザインしたらこのザマです。

最終的な解決法

footer要素も全て突っ込む。

GitHubのほうは明日反映させる〜

Raspberry Pi

OSCのセミナー、申込変更したの。

Raspberry PiでIoT自動化や制御について紹介するやつ

ラズパイ興味あるのでそれにした。

.

Webページちまちま書いていた。

https://developer.mozilla.org/ja/docs/Web/HTML

ここわからないときに参考にするの良さそう。

https://developer.mozilla.org/ja/docs/Web/Guide/HTML/Content_categories#Phrasing_content

ここのあたりとか英語の文法みたいだなあとおもった。

文法にがて〜〜

.

夜は久しぶりにMastodon張り付いたあ、

そして音声upできるようになったので

早速試した。

最初はamrで投稿エラーでて

mp3に変換したら投稿できたよ。

んぱかマーチ!

クレヨン王国のOPがエンドレスループしていたので

それを歌いました。

楽しかったので、ぼちぼちupしていきたい。