「にせ昔話製造マシーン」が作れたらいいなと、ゆるい気持ちで作ったJavaScriptの練習帳ダサジャバス。意外に何かしらできてる(嬉しい)ので、しばらくの間この記事で更新情報をお知らせしたいと思います。
サイトデザインがシンプルなので、スマホで使うのにちょうどいいかも。
ランダムに言葉を出す
単語ミックス
2022.2.4(金):表を使って言葉を組み合わせます。昔、意味不明な言葉を量産してショートショートのアイデアのヒントにするというのを読みました。それを思い出したのでJavaScriptで作ってみました。
表の縦と横に好きな言葉を入力して完了ボタンを押すと、各マスに縦横に対応した言葉が表示されます。入力済みの画像で何となくわかっていただけるかな……と思います。
登場者2人の関係をランダムな短文で表示
2022.2.2(水):押したボタンにそった内容の短文がランダムに表示されます。内容の充実が今後の課題。
「誰、何をした」を選ぶ
2022.1.30(日):人物、異界の者、何をするのか、をランダムに表示します。ひとつずつ押してもいいし、いっぺんに押すボタンも使えます。
1から8までの数字をランダムに出す
2022.1.29(土):ただランダムに出現させても、同じものが何回も出てきたり、全く出てこないものがあったりしました。なので全部が一回ずつ、しかもランダムに出てくる方法をググって試してみました。シャッフルしてから順番に表示する方法でうまくいきました。
数字の1から8なので、なにかくじ引き的な用途に使えるかも。
クイズ
昔話4択クイズ
2022.1.25(火):一番はじめに、動画を見ながらやってみて出来上がったもの。クイズの内容を昔話に変更しました。動画がわかりやすかったおかげで、「もっとできるかも」と思えました。
動画のURL紹介してるので、JavaScriptやってみたい人にぜひ見てほしいです。
余談:アドセンス広告が出なかった問題がdisplay: flexを消したら解決した
ダサジャバスはテキストエディタでタグ書いて、BootstrapのCSSにリンク貼って……で作りました。ほぼほぼ素人のコードですね。^^;
それで困ったのが、アドセンス広告が全く出てくれなかったこと。
コンソールをよく見てみると、adsbygoogle.push() error: No slot size for availableWidth=0’……なんちゃらと書いてあります。しょうがない、ぐぐってみるか。
で、原因がわかりました。私、広告を表示するスペースを、d-flex で囲っていました。d-flexってBootstrapでdisplay: flex;のことです。display: flex;が原因でした。
これ削除したらすぐに表示されました。ががーん!
本当に助かりました!!
コメント