周期算インボックスの作成

周期算の図を作るのに、3種類の番号を揃えようとして発狂。落ち着いて考えてみたら…CSSのカウンターで行けるんじゃないか?

カスタムCSSで実験

2021.7.12版

標準版

これに、周期算で使った三種類の番号(通し番号周期番号周期内番号)と区切り線が自動で付く。我ながら天才だろうこれ

周期算インボックス(Skz-ibx1)の中に入れた子section(無名)が各グループになり、sectionの中に入れた孫div(無名)の数字が項になる。

図1:
2,
4,
6,
8,
10,
12,
14,
16…

 

説明書き

マニュアル版

問題を解く際の最後の(N番目などの)グループは、周期算インボックス(Skz-ibx1)内の子section(無名)に重畳クラス「man」を指定すると各番号をマニュアルで記述できる。

子sectionの中の第一孫div(無名)がグループ番号になる。番号を挟む記号「〈」「〉」は不等号では無く山括弧

第二以下の孫divの中のひ孫div3つが「項(数値)」「グループ内番号」「通し番号」になる。

中略記号は空の子sectionに重畳クラス「lps」(ellipsis)を指定すると自動で表示される♪

図1:
2,
4,
6,
8,
10,
12,
〈N〉
(N×4)-1
[1]
(2×N)-1
N×4
[2]
(2×N)

 

説明書き

我ながら、スゲー!

次の課題

・番号を強調する。答えを指し示したり。sectionやdivに重畳クラス「ex」を指定したら表示が濃くなるみたいな

・間にダミーを入れる(3と4の倍数を除いた群数列の存在しない12nのようなもの)。重畳クラス「dmy」を指定すると、番号表示がされずカウンターも進まなくすれば良いか

これがクリアできたら、周期算のページにも実戦投入できるか

試験投入

強調表示を実装

9番目の石の位置

 

1周期が4個なので、9÷4=21
2グループの後の1個目なので
3グループの1番目と分かる

その2(記事の順序に作っている)

省略記号の後が面倒くさいが、ショートコード化でもしない限りしょうがないな…

100番目の石の位置

〈25〉
[4]
(100)
1周期が4個なので、9÷4=21
2グループの後の1個目なので
3グループの1番目と分かる

あ~まだ調整が必要だな…お金払って外注するかマジで

タイトルとURLをコピーしました