どうも！LSSです！！ いよいよ12/31、今は23:35です。 こんな時間から記事を書き始めてみますｗ 色々ありましたねぇ 2022年、振り返ってみると色々な事がありました。 まず転職。幸いにして好条件で１年契約の業務委託として契約を結んでくださった企業があり、とっても助かりました。 次に、前述の転職と関連しますが株式投資の開始。 これがなかなかに面白い、ただし勝ててはいませんがｗ 未だ知らない事が多々あって、新たな発見がよくあります。 次に、このブログの毎日更新の終了。 時間の使い方を見直したくての決断でしたが、見直しについてはまだまだな感じです。 あと、父が亡くなったというのもありました。 それから、2022年…というのからは少し離れるかもですが、嫁に行った妹が第二子を妊娠中で、今かなりおなかが大きくなっています。 上の子は女の子（２歳半）ですが、次も女の子のようで、こちらは来年誕生

どうも！LSSです！！ CSSを知らなくてもなんとなく遊べる（？）、CSSパズル第三問です！ CSSパズル カテゴリーの記事一覧 - Little Strange Software CSSパズル　第三問！ 「現在のコード」について やっている事と言えば… 応用例 CSSパズル　第三問！ ２つの写真があります。 上が「お手本」で、下が「回答」です。 そのさらに下に、赤い枠線で囲んだコードがあり、その中にいくつかの選択肢が入っています。 選択肢を変更すると「回答」の表示がそのコードで生成したものに変化するので、「回答」を「お手本」と同じものになるよう、正しい選択肢を選ぶ、という出題です。 なお、選択肢を変更した際に、さらにその下にある「現在のコード」がその選択肢の場合のコードとなります。（つまり、その時点で表示されている「回答」のコードですね） 全ての選択肢が正しいものになり、「お手本」と「回

どうも！LSSです！！ 1000記事到達した時、３年経過した時にも考えていた事ですが… とりあえず更新頻度を変更（毎日更新終了）します！ 時間の使い方を諸々考え直して、これから始める事を考えてみます^^ ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^

どうも！LSSです！！ 最近、ブログ巡回しているとたまたまなんですが「神戸を含む関西方面への旅行」記事を、別々の３，４つのブログで見かけました。 それぞれ記事にされたタイミングが重なっているだけで、実際に来られたのは別々のタイミングのようですけどね。 little-strange.hatenablog.com ↑かなり前に、こんな記事を書いていたりもしましたが…やはり本当の旅行者目線になると、地元民の知らない新たな一面が色々あるものですね^^ ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^

どうも！LSSです！！ 最近、Amazonで古い漫画を購入しました。 吾妻ひでお作品集 1~最新巻 [マーケットプレイス コミックセット] 作者:吾妻 ひでお 奇想天外社 Amazon ↑これなんですけどね。 既に別の版で読んだ作品も多いのですが、未読のものも多々あり、良い買い物をしたな、と思っています。 が、今のAmazonの金額を見てびっくり！！ ちょっと怖い金額になっていたので、自分のメールを読み返すと、自分が購入した時点では￥2255でした。 やはり年数が経っている事と、おそらくは発行部数もあまり多くない？事からだいぶレアな本になってしまっているのかもですね。 ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^

今週のお題「カバンの中身」 どうも！LSSです！！ 今週のお題「カバンの中身」…ちょうど最近どこかに（多分どこかのコメント欄）に書いたっけ…。 仕事に行く時用のカバンと、休日用のカバン、別々に用意しています。 仕事用のカバンが少々問題で…だいたい持ち歩く必要も仕事で使うわけでもないものが入ったままになっていたりしますねｗ 休日用のカバンの方は、縦長のショルダーバッグを愛用しています。 こちらはかなり以前に購入したものですが、近年になって「12.1インチ画面のノートPC、CF-SX3がすっぽり収まる」事に気づき、そのバッグの別のポケットに薄型マウスやモバイルWiFi、モバイルバッテリなどの薄いものを入れるのがマイブーム^^ MSOffice 2019/Win 10搭載 Panasonic CF-SX3/第四世代Core i5-4200U 1.6GHz/メモリー: 8GB/SSD:256GB/

どうも！LSSです！！ 「結構前に買っては見たものの使ってない（開封もしていない）」ものがあります。 マイクロソフト ワイヤレス ディスプレイ アダプター P3Q-00009 : Wi-Fi不要/ Miracast/ パソコンやスマホの画面をミラーリング/ USB給電可/ 簡単接続/ Windows/ Surface ( ブラック ) マイクロソフト Amazon ↑これなんですけどね。 little-strange.hatenablog.com なんとなく、プロジェクターと相性いいかな？と買ってみたのでした。 …そろそろいい加減、試してみようかなｗ 他にも「買ったけど使ってないもの」にNAS（LAN接続のHDD）なんてのもあったりしますが、スマホとPCでのデータ共有に役立ちそうでもあります。 そちらは同居家族とのデータ共有にも使えますね。 …逆に言えば、家族に見られたくないデータは置かな

今週のお題「最近おもしろかった本」 どうも！LSSです！！ 最近、近所の古本屋さんで「１冊１００円の本、３冊で２００円」で売られているところで、以前から「気にはなっていた」漫画（文庫版）を購入しました。 同棲時代　（1） 作者:上村一夫 eBookJapan Plus Amazon ひとつは「同棲時代」。 昭和の一時代をあらわす作品として、よく名前を聞きます。 忍者武芸帳（影丸伝）（１） 作者:白土三平 小学館 Amazon もうひとつは「忍者武芸帳」。 白土三平氏は忍者漫画の巨匠として知られていますが、実は今まで読んでこなかったりしました^^; 古い漫画が好きで、それも自分が生まれるより前の年代、戦後からの漫画史に興味を持っていましたが、ようやくにしてこれまで踏み込まなかった領域に手を出した感がありますｗ 同時代の作品として、つげ義春氏の本は色々読んでいましたが、いずれにも共通するところ

どうも！LSSです！！ デジタルカメラやスマートフォンが普及した昨今。 フィルムカメラのように「フィルムの無駄」を気にせず、パシャパシャと気軽に撮影が楽しめるようになりましたね^^ それでも時々ふと、あの白いフチのある写真に懐かしさを覚えたりします。 スマホで撮影後に画像加工するのも手ですが、CSSなら画像はそのままでコードに少し手を加える事で、懐かしい白フチ写真を演出できます。 写真っぽい写真 コード 手順 その他の例：楕円 写真っぽい写真 コード はてなブログの「写真を投稿」機能で写真をアップロード・記事に挿入した後に、コードを付け足します。 <p style="border: 1px solid black; padding: 3%; box-shadow: 10px 10px 5px 0px gray;"><img style="display: block;" src="http

どうも！LSSです！！ これまで何度か「CSSでお絵描き」をやってきましたが、今回はその中でも特にシンプルな「linear-gradientで風景を描く」ものをツール化してみました。 linear-gradientで遊ぼう！ 使い方 linear-gradientで遊ぼう！ コード 使い方 色選択ボックスとスライダーのセットが９つ、並んでいます。 ここで指定された色がそのまま、「上から下に向かうlinear-gradient」に設定されたグラデーションが、下の枠に反映されます。 スライダーはそれぞれの位置指定（%）に該当します。 色選択やスライダーをいじると、リアルタイムに枠のグラデーションが変化し、またその状態のlinear-gradientのコードが表示されます。 CSSとしてこの生成されたコードを使用する場合は、 background-image:linear-gradient(なん

どうも！LSSです！！ 明日休みで明後日出勤、なんですが…ちょうどその明日が職場で変化が重なる日。 明後日行くと、ちょっと取り残された感じになるかもですねｗ …いうほど大きな変化ってわけでもないのですが、中には自分の仕事に大きく関わりのある事もあり…それが遅れない事を願うばかりです^^; リモートで確認できるので見ておこうっと。 ってなとこで、今回はこのへんで！ 次回もまた、よろしくお願いします^^

どうも！LSSです！！ little-strange.hatenablog.com 先日、↑のような記事を書いていました。 要は「スーパーで割引シールが貼られたパック寿司を購入するにはどのタイミングで行くのが良いか？」という話で、もちろんスーパーによっても違うでしょうし、読み手に何のメリットもない記事ですｗ なんですが、その後、１８：３０頃に同スーパーに寄ったところ… ちょうど半額シールを貼ってまわってる場面に遭遇しました！ 実にあっさりと答えが出ましたねｗ その時点でもまだ数パック残っていたので、そのぐらいのタイミングで向かうのが良さそうです。 …一方、１０月に入って様々なものが値上がりしていて、例えば「700mlのコカ・コーラ（ペットボトル）」が確か77円だったものがいきなり108円になっていました（税別）。 うーん、これは特に顕著すぎる値上がり例かもですね^^; コカ・コーラに関して

どうも！LSSです！！ わざわざお姫様の画像を描いてまで作ったネタ、 little-strange.hatenablog.com お姫様の画像にしたのは、「高貴な身分の方の、ちょっとかがんだお辞儀」のような動きになるかな？と思ったからですが、出来上がった動きが「やはりどう見てもスクワット」でしたｗ 画像の作り方によっても違ってくるのかもですが、コードのほうでなんとかもう少し「お辞儀」らしくならないかな？と考えてみました。 姫のお辞儀 マウスホバーで「ごきげんよう」 ざっくり解説 姫のお辞儀 延々とお辞儀を繰り返す、腰の低いお姫様です^^ コード <style> @keyframes ozga{ 0%,30%{height:200px;} 90%,100%{height:100px;} } @keyframes ozgb{ 0%,30%{top:0px;} 90%,100%{top:100p

どうも！LSSです！！ little-strange.hatenablog.com ですが、やはり例として分かり辛かったですね^^; 伸び縮みしているのか、単に隠れているのかという辺りが特に。 画像を使ってみるにあたり、 little-strange.hatenablog.com で使った方法をまた用いてみました。 そして、勢いで２パターン作ったので公開します^^ お姫様のお辞儀かと思ったらやっぱりスクワット ノリノリの姫 あとがき お姫様のお辞儀かと思ったらやっぱりスクワット コード <style> @keyframes testa{ 0%{height:200px;} 100%{height:100px;} } @keyframes testb{ 0%{top:0px;} 100%{top:100px;} } .test{ position:relative; width:280px;

どうも！LSSです！！ 画像の下半分がマウスホバーで出現 コード 枠サイズの調整 画像の指定 あとがき 画像の下半分がマウスホバーで出現 写真にマウスカーソルをのせてみてください（スマホの場合はタップ） コード <style> .halfpic{ position:relative; width:280px; height:400px; transform-style: preserve-3d; perspective:500px; } .halfpic div{ position:absolute; left:0; width:100%; height:50%; background-image:url('画像ファイルのURL'); background-size:100% 200%; background-repeat:no-repeat; } .halfpic div:nth-chi

どうも！LSSです！！ CSS小ネタとして、跳ねるボールを作ってみました。 と、ボールが跳ねるようなものはこれまでにも作っていましたが、 「着地して跳ね返る時に横長にひしゃげる」 という細かい芸を入れています。 跳ね続けるボールとfloat:left; コード 色々… 跳ね続けるボールとfloat:left; ボールが跳ね続けます。 そして、float:left;を指定しているため、それ以降の文章がこのように回り込むカタチになります。 float:left;の一行を削除すると、横に文章が並ぶ事がなくなります。 コード <style> @keyframes bnda{ 0%,100%{background-position:0 0;} 50%{background-position:0 100%;} 0%,47%,57%,100%{background-size:30px 30px;} 50

どうも！LSSです！！ 以前に、様々な「ページ（記事）内に文字を隠す」方法を書いていましたが、今回もそんなひとつ。 通常、Webページ内の要素（画像・段落など）はページ記述者が指定したサイズ（指定していなければデフォルトのサイズ）で固定されて表示されますが、CSSには 「ユーザー（読者）が自由にサイズ変更できるようにする」 という指定があります。 今回はそれを利用して「最初は指定したサイズで表示され、ユーザーがサイズ変更で大きくする事で中身が見えるようにする」コードです。 ※追記！スマホだと操作しづらかったり、出来なかったりする場合もあるようです。 試してみた範囲では、「Androidスマホ＋はてなアプリ→右下角を捉えにくいがなんとか」「iPhone＋はてなアプリ or Chrome or Safari→いずれも試みるもできず」 【JavaScript】iPhoneでも要素のリサイズ -

どうも！LSSです！！ 【ツール】簡易お絵描きアプリ【試作品＋】 - Little Strange Software の「線の引き方」を根本的に見直そうとしていたところ、「完成版には入れるつもりはないけどちょっと面白い機能」がたまたま出来てしまいましたｗ 闇に葬る前に、ちょっと他の人にも見てもらいたくて、晒してみます^^ お絵描きアプリ劣化版 操作説明 ちょっと面白い機能 どうしてこうなった お絵描きアプリ劣化版 線を引く 塗りつぶす 描画時に都度消去 パスを閉じる 操作説明 まず「劣化版」としているのは、すでに作っていた「画像保存」「サイズ変更」「筆圧による太さ変更」などが実装されていない状態だからです。 キャンバス（グレーの格子模様の枠）上で、マウスドラッグか指やペンで自由に線を引く事ができます。 キャンバスの下に「線を引く」「塗りつぶす」「描画時に都度消去」「パスを閉じる」の４つのチ

どうも！LSSです！！ 「CSSのkeyframesでリズミカルなアニメーションを作ろう」という試み、なんだかこんなのが出来ました。 謎リズムアニメーション コード なんなんでしょうね？これ 変更例 謎リズムアニメーション コード <style> @keyframes nazorzma{ 0%,87.6%,100%{background-position:0 0;} 12.5%,25%,37.5%{background-position:0 100%;} 37.6%,50%{background-position:100% 100%;} 62.5%,75%,87.5%{background-position:100% 0;} 0%,25%,50%,75%,100%{background-size:50% 50%;} 37.5%,87.5%{background-size:100% 50%;