今週のお題「夏物出し」 どうも！LSSです！！ 今週の はてなブログのお題「夏物出し」、ですが…。 自分の場合、出すというより 転職を機に、ユニクロの感動ジャケットを購入していたのを、しまいましたｗ シャツ＋スラックスという通勤スタイルになります。 …と、そうなると困るのが「ポケットの数が激減する」事ですね。 そこで昨日、百均を巡ってダイソーで小型のウエストポーチ（ベルトに通すタイプ）を購入。 そこにモバイルバッテリとWiFiルータ―を装備、スラックスのポケットには小銭入れやICOCA入りカード入れやハンカチなど。 シャツの胸ポケットにスマホ、という感じに落ち着きました^^ あと、あれがそろそろ必要になりそうかな THANKO ネッククーラーEvo 専用バッテリー同梱モデル TK-NEMB3 (ブラック) THANKO Amazon ↑ 自分が持ってるのとちょっとタイプが違いますが「ネック

どうも！LSSです！！ いやぁ、華麗に1000記事めをスルーしていましたｗｗｗ 「え？じゃあ1000記事めはどれだったの？？」と逆算すると、 little-strange.hatenablog.com ↑この記事だったんですね。 この分だと「1000日め」になるのは…今週木曜日かな？ ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^ すぐに役立つ366日記念日事典 第4版 【上下巻】 作者:加瀬 清志 創元社 Amazon 人生で一番大事な 最初の1000日の食事――「妊娠」から「２歳」まで、「赤ちゃんの食事」完全ＢＯＯＫ 作者:クレア・ルウェリン,ヘイリー・サイラッド ダイヤモンド社 Amazon

どうも！LSSです！！ little-strange.hatenablog.com にブックマークコメントで、 3Dみたい。これ、大量にランダムに跳ねてたら可愛いかも。めんどくさい？笑 css conasaji 2022/06/04 23:15 といただきました^^ さじ様、ありがとうございます！ 大量に跳ねてると、楽しくなりそうですね！ ランダムに、の部分については、「横移動」「縦移動」「サイズ変更」のアニメーションの「再生にかかる時間」をずらす事で周期をずれさせてランダムっぽく見せていました。 ので、「大量にランダムに」という感じにしようとすると単一のHTML要素にbackgroundをカンマ区切りで並べる方式ではなく、HTML要素自体を大量に用意するのが良さそうです。 コードは流用できる部分が多いものの、構造から変わってくるので、試しに作ってみました！（汎用性については…謎ｗ） ボー

どうも！LSSです！！ 先日、 little-strange.hatenablog.com という実験的な記事を公開していました。 「実験」だったのは、今ひとつネタとして活用する方法でピンとくるアイデアがなかったからなのですが、その状態でも、 non704.hatenablog.com whisky-coke.hatenablog.com norikoさん(id:non704)や、のんべえさん(id:whisky-coke)が使い途を考えて試みてくださっています^^ その、norikoさんの記事のコメントの中で、「カーテンで舞台が開く」という新たなアイデアを出しておられたので、こっちで作ってみました^^ カーテン コード 傾きについて divタグの中に書いたものを覆い隠すのには カーテン 今、新しい時代の幕が開ける…！！ コード <style> @keyframes curtaina{ 0

どうも！LSSです！！ ちょっと前に初めて、証券取引を始めました。 購読しているブログの中に株に関するブログもいくつかあり、試してみたくなった＆確認したい部分があった＆前から興味があった、という感じで、まだまだ分からない事だらけの初心者ですｗ 今日までの履歴 もっと前に考えていた事 投資信託 分散投資、を最重要視していたのですが… 損切り未経験 今日までの履歴 4/11　開始。キャンペーンで「3000円程度の株を数種類の候補の中から選んでもらえる」ので、2,843円分（3株合計）ゲット。 4/13　10,000円入金。ここから、ちょこまかと１株単位で買ったり売ったり。 4/15　S&P500に3,000円投資。 4/19　ブログに株を始めた事を書く。初めてｘ3 - Little Strange Software 5/23　30,000円入金。 5/24　S&P500に7,000円投資。 6

どうも！LSSです！！ CSSのbackground-imageにlinear-gradientを指定し、それをkeyframesアニメーションの対象にした場合。 例えば、 @keyframes キーフレーム名{ 0%{background-image:linear-gradient(0deg , 色１ , 色２);} 100%{background-image:linear-gradient(90deg , 色１ , 色２); } のように指定したとしても、角度が「0degから90degに徐々に変化」…とはなりません。 他のgradientもそうですが、 ( ) の内容はkeyframesの「徐々に変化」の途中経過の補完対象外のようです。 ですが、background-position や background-size の指定はアニメ変化してくれる事から、「角度がアニメ変化している」よ

どうも！LSSです！！ 実に…長かった。 長かったですが、ようやく「転職後の初振込」されました^^ ちなみに、前職の給与というのが「当月25日払い」となっていたので、４月初旬付で退職したLSSの給料は最後に振り込まれたのが3/25。（厳密には4月初旬分も発生していましたが、税金等の控除の方が大きくてマイナス） 貯えも退職金もハロワの失業給付もない状態でどうにか今日まで生き延びましたｗ （クレカ払いには頼りました^^;） 本日、振り込まれたのは前職の手取り２か月分を超える金額なので、金銭的に落ち着けそうです^^ ※年間の総額が決まっていて、支払われ方は月割りと期割りと一年後と＋αが混在する、ややこしい支払われ方。例えば来月は今月より少ないですが、今月の金額×１２よりも年間総額は大きい、といった具合。 といって、来年以降の事も考えないとなので散財するわけにも行かず。 始めたばかりの株（遊び感覚

どうも！LSSです！！ 今日、三宮を歩いていると、区役所や三宮図書館のそばにあった商業施設「サンパル」が間もなく再開発のための解体？に入るというのを知りました^^; いやぁ…中に入ってる店が次々と閉店していくな…とは思っていたんですが、そのための立ち退きだったんでしょうか。 そして、その中でも残っていた喫茶店もついに… お気に入りのチョコパ提供店が…。 移転してもメニューと属性が変わらないといいな。 pic.twitter.com/q0rbwunQBh— LSS (@LSS0324) 2022年5月30日 ここはアレです。 過去に、 little-strange.hatenablog.com little-strange.hatenablog.com に書いていた、「パフェっぽいスイーツを○○ソフトクリームという名称で提供」するお店でした。 …でも、「閉店」と言いつつも「移転オープン」が予

どうも！LSSです！！ CSSで、３種類あるgradientを用いて「模様が繰り返すタイルパターン」のような背景を描画できます。 中でも、repeating-conic-gradientがfromの角度指定を変更する事で、思いがけないような模様の変化をもたらすのが面白いです^^ 【CSS】謎の背景模様『山』【小ネタ】 - Little Strange Software 今回はその「repeating-conic-gradientの模様変化」を手軽に体験できるツールを作ってみました。 repeating-conic-gradientによる背景模様生成ツール 使い方 repeating-conic-gradientによる背景模様生成ツール 開始角度： 中心位置（横）： 中心位置（縦）： 繰り返し： 色1：　色2： 幅： 高さ： ランダム設定 コード 使い方 最初は、白と黒の格子模様、オレンジ色

どうも！LSSです！！ ちょっと気になったカップ麺があり、コンビニで買ってみたら気に入ったので、箱買いしちゃいましたｗ ドロラ王 ドロっとしていてこってりといえば… ドロラ王 日清食品 日清ドロラ王 ドロ、コッテリ、鶏白湯 125g×12個 日清 Amazon それが↑こちら！ドロラ王！ カップ麺としては単価は高めです。 「ドロ、コッテリ、鶏白湯」と書かれていますが、本当にドロっとしているのが気に入りましたｗ ドロっとしていてこってりといえば… 某ラーメンチェーン店が有名ですが、あちらもその名を冠したカップ麺がありましたね。 それも見かけた時に買ってみたのですが、 「味はそれっぽいけど…さすがにカップ麺であのドロッと感は出せなかったか」 と思ったものでした。 が、このドロラ王は本当に「ドロっと」をカップ麺で実現してくれていますｗ 「なんだ、出来るんじゃないか」と^^ その弊害なのか、ちょっ

今週のお題「人生で一番高い買い物」 どうも！LSSです！！ 今週のはてなブログのお題…一番高い買い物ですか。 家を買った、マンションを買った、みたいな経験がないもので、自分でお金を出して買ったもので金額として一番高いものとなると… 「百万ちょいの車」 でしょうか。もちろんローンでしたがｗ ２０代の頃の話で、もう車に乗らなくなってからもかなりの年月が経ちました。 百万円は大金ですが、「人生で一番高い買い物」としては安いような気もしますね^^; もし今、自分がそのぐらい（あるいは それ以上）出して何か買いたいものは？と考えてみたところ…（投資とかは除外して）「１台凄いPCを組みたい」が浮かびましたが、いや、かなり欲張っても４０万ぐらいしかかからないのでは？ってなっちゃいますｗ（欲張らなかったら２０万程度で考えるところ） っと、新しく始まった仕事の最初の入金が５月末、もう間もなくです。 調子に乗

どうも！LSSです！！ スイッチ迷路、とりあえず一通り遊べるようになったので公開しちゃいます^^ 迷路データは新たに作りましたので、前回のスイッチ迷路をクリアした方も再び迷う事ができますｗ アナツくんのスイッチ迷路 遊び方 過去記事～ 他に考えていて未実装なアイデア エディットモード 迷路データ圧縮 アナツくんのスイッチ迷路 遊び方 迷路画面内をクリックすると、その方向に向かってキャラクター「アナツくん」が移動します。 迷路には黒い壁の他に、赤・青・黄色の壁と、赤・青・黄色のスイッチがあります。 「アナツくん」がスイッチのマスに入ると、迷路画面の下に 「○○のスイッチがあるぞ」と表示され、「押す」ボタンが現れます。 スイッチを押すと、そのスイッチの色と同じ色の壁が開き、通行可能になります。 （ただし、最後に押したスイッチの色の壁だけが開き、その他の壁は閉じて通行不可になります。） スイッチ

どうも！LSSです！！ はてなブログに記事を書く際に、 [:contents]　と書くと、その部分が記事中に入れた「見出し」の一覧、「目次」になります。 今回は、その「目次」をCSS装飾で遊んでみました。 コード 作ってみたものの… また、１文字めの背景色が違うのも ちなみに、１文字めだけ背景色を指定するのは コード <style> ul.table-of-contents{ transform-style:preserve-3d; perspective:500px; background-color:transparent!important; box-shadow:0 0 0 0 transparent!important; border:0!important; } ul.table-of-contents li{ transform-origin:0% 50%; backgrou

どうも！LSSです！！ little-strange.hatenablog.com にて、いかにもな手抜きキャラを描きましたが、それにちょっと手を加えました。 （いかに手をかけずに…と考えていたのにそれに反するかのようなｗ） これで完成ってことにしてもいいかな？ キャラクター コード 問題点と解決について 命名発表！ キャラクター 今回はアニメーションしません。 スイッチ迷路のキャラとして使うつもりですが、そこでもアニメーションはせずに、手足だけ交互のパターンを一歩ごとに切り替えようかと考えています。 コード <style> .test1,.test2,.test3,.test4{ display:inline-block; border:1px solid black; width:54px; height:54px; background-repeat:no-repeat; } .te

どうも！LSSです！！ 最近、こんな事を考えていました。 「迷路ゲームを作成するにあたり、自キャラもこの際コードで描きだしたい。また、どうせなら４方向の画像、かつ手足を振って各２パターン用意。ただし、極力労力をそれにさきたくない！」 とｗ そうして考えているうちに、 radial-gradientで描いた円で構成されたキャラなら手軽そう 考えてつめてみると、「８つの円」があれば表示位置すら変えず、「表示する・しない」「表示順の前後だけの調整」で要件は満たせるのでは？ と思い至り、それで実際に描いてみました。 歩くキャラクター コード 今回のサンプルでは 歩くキャラクター コード <style> @keyframes test1a{ 0%,50%{ background: radial-gradient(5px 5px at 21px 23px,#ffffaa 80%,#000000 81%

どうも！LSSです！！ この時間まで、スイッチ迷路を触っていました。 キャラはできていないまま、テストプレイ（移動できてスイッチを変えられる）できるところまで行ったものの…スマホ対応がどうかな？とか試しているうちに、PCでも動かなくなり^^;;; 気づけばこの時間ですｗ ちと集中しすぎましたね^^;;;;; スクリプトの問題が解決してもキャラもまだなので、やはりちょっと先になりそうな感じです。 追記！なんだか解決しました…ので晒してしまおう ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^

どうも！LSSです！！ mioさん(id:mio20100501)が、はてなブログの記事背景でダイバーが潜水するアニメーション背景に挑戦されていました。 美麗な画像で、潜水するダイバーの動きにとても迫力があります^^ mio20100501.hatenablog.com そこで、「潜水するダイバーと浮上するダイバーを同時に表示できるか」という話になったので、ちょっと作ってみました。 …ただし、こちらのこの記事ではLSSが適当に描いた画像を使用していますｗ コード 使用画像 表示サイズと移動量の話 余談 コード <style> @keyframes divers{ 0%{background-position:0px 0px,0px 0px,0px 0px;} 100%{background-position:-800px 1600px,0px -800px,0px 0px;}/*ダイバー画

今週のお題「何して遊んだ？」 どうも！LSSです！！ 今週のお題「何して遊んだ？」との事ですが、昔やっていた遊びを ちらほらとこのブログに書いた事もありましたね。 紙テレビ ゲームブック 創作折り紙 その他、まだ記事にしていない中に… 小学生時代 中学生時代 高校時代 紙テレビ little-strange.hatenablog.com 小学生の頃に、こんなのを作って遊んでました。 記事にしてみると、同じような事をされていた方がおられたようでびっくり！ ゲームブック little-strange.hatenablog.com また紙ネタですが、中学生ぐらいの頃からノートにゲームブック（選択肢で分岐する話）を書いてました。 創作折り紙 little-strange.hatenablog.com このへんになるともう成人後ですが、昔々に考えた折り紙を今年になって復元しました！という記事です。

どうも！LSSです！！ 【実験】CSS、backgroundプロパティで迷路を描くテスト（の準備段階） - Little Strange Software 考えてる迷路案「スイッチ迷路」 - Little Strange Software と書いてきた「スイッチ迷路」、とりあえず「おおむねの描画」が出来たのを途中経過ですが晒してみます。 スイッチ迷路・描画案 まだ描いてないもの 今回の迷路 スイッチ迷路・描画案 まだ描いてないもの スタート地点、ゴール地点、迷路を歩むキャラを描き込まないと、ですね。 そして迷路上を移動する仕組みやゴール判定を加えると完成、となります。 今回の迷路 サンプルですが、一番左上をスタート地点、一番右下をゴールとして、ゴール可能なものを考えて作っています。 だいぶ面倒だったので、完成もこのままの迷路データかもですｗ 改めてルールを書いておくと、 黒い壁は通行不可

どうも！LSSです！！ このブログに、 little-strange.hatenablog.com というカテゴリがあります。 HTML、CSS、JavaScriptなどの「さわりはじめ」だけを軽く説明するような内容で、はてなブログでも試せるような内容であるところからWeb関連の話のみになっています。 が、仕事のほうで「SQL超入門のさわりだけ」みたいな感じのものを今日ちょっと書いてみました。 タイトルはもちろん異なりますｗ が、「難しそう、と極力思わせないように」というのと「業務なのである程度の硬さ」のバランス…とか考えだすと、なかなか迷うところがあります。 とりあえず「１回２ページ」のを３回分書けたのは、ここで書いていた経験も役立ってるのかな、とか、逆に仕事で書いてる経験がブログの方にも活かせたりするかも？とか思う今日この頃です。 ってなとこで、今回はこのへんで！ 次回もまた、よろしく