ネットワークエンジニアで高きを目指せ(サイバージャヤ、マレーシア)

世界を股にかけて転職する男(マレーシア<ー>ベトナム)

現在の課金状態

ドットインストール:月1000円

Progate:月980円

AWS:0.53USD/Month

Paiza:月1078円:7月1日までに解約すること!

Amazon Unlimited:解約(月1000円)

棒倒し法を学んだ(これ思いついた奴天才やわ)

 

どうもプログラミングの勉強を開始してからそこそこ更新がはかどっております。

今日も元気にドットインストールをやっています。

 

私をよく知る友人なら知っていると思うのですが、今毎日同じコードを書いて若干変える努力をしています。

 

今作っているのはタブです。今日で4回目です。

さすがにだいぶ仕組みが分かってきたし、課題も見つかりました。

ページを開くと、同じタブが指定されているようにするために、menuのliタグをactiveで指定してやります。

指定されていないタブのコンテンツを一旦見えなくするために

.content{

display:none;

}

としてやり、しかしその場合、指定されているタブのコンテンツも見えなくなってしまうので、active指定されている分については

.content.active{

display:block;

}

とすることで、noneとならないようにできます。

詳しくは、以下URLでソースを見てみてください。

https://cyberjaya.xyz/2/practicefortab/tab-jikken2/tab-1-2.html#

 

この仕組み非常に面白い。

 

今後の課題

document.querySelectorAll の復習、ブラッシュアップをやるべし。

<=よく分かってない。。。

 

後、HTML Canvasを使用して迷路作りに挑戦いたしました。

7*7 の迷路で更新を押すたびに、迷路がランダムで変化します。

本当はもっと大きいタイプを作りたかったのですが、Canvasは想像していたよりも遥かに重く、この11年前のPC(125USD)では少し無理がありました。

7*7で我慢したというところです。

現在途中ですがURLは以下の通り。

https://cyberjaya.xyz/2/meiro/meiro.html

 

学んだことは迷路作りには棒倒し法という手法があることくらいですか。

正直複雑で一回作っただけでは仕組みを理解できたなったのですが以下棒倒し法の概要です。

 

 

棒倒し法
(1)ひとつ飛びに棒に見立てた壁を作る。
(2)1列目の棒を上下左右のどちらかに倒す。
(3)2列目の棒を左以外のどれかに倒す。

 

以下説明です。0は道です。ひとつ飛びに1が書かれていますがこれが壁役です。
0 0 0 0 0 0 0 0 0 0 0
0 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 0 0 0 0
0 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 0 0 0 0

 

(2)1列目の棒を上下左右のどちらかに倒す。  

赤くなっている箇所が一列目の棒の部分です。上下左右どこでもいいので1ずつ増やしてみます。

0 1 0 0 0 0 0 0 0 0 0
0 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 0 0 0 0
1 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 0 0 0 0

 

(3)2列目の棒を左以外のどれかに倒す。

1は2列目以降の棒です。左以外の3方向に倒しています。

0 1 0 1 0 1 0 0 0 1 0
0 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 1 0 0 0
1 1 0 1 1 1 0 1 0 1 1
0 0 0 0 0 1 0 1 0 0 0

□をスタート地点、■をゴールとして目指します。あら不思議迷路の出来上がりです。

□ 1 0 1 0 1 0 0 0 1 0
0 1 0 1 0 1 0 1 0 1 0
0 0 0 0 0 0 0 1 0 0 0
1 1 0 1 1 1 0 1 0 1 1
0 0 0 0 0 1 0 1 0 0

 

これ思いついた人天才かと思います。

 

 

 

 

 

 

読者登録をしていただけると大変助かります。

 
 本サイトが参考になったらクリックをお願いします。

  にほんブログ村 にほんブログ村へ