2021-09-01から1ヶ月間の記事一覧
どうも！LSSです！！ 【JavaScript】アナログ時計を作ってみました - Little Strange Software で使用していたコードのうち、スクリプト部分についての解説を、 little-strange.hatenablog.com に書きました。 そのスクリプトでは、現在時刻の取得を「Date.n…
どうも！LSSです！！ 【JavaScript】アナログ時計を作ってみました で、即興でアナログ時計を作ってみました。 画面を構成する、CSS部分についての解説はしていましたが、今回は肝心の「JavaScript」部分についての解説記事となります。 コード（script部分…
どうも！LSSです！！ だいぶ以前から、CSSのkeyframesを使ったアニメーションを色々試していましたが、最近になって「え、こんなの出来るんだ！？」と知ったものがありますｗ カチコチ動くアニメーション コード animation-timing-functionの「steps」 ちな…
どうも！LSSです！！ 昨日の「【JavaScript】アナログ時計を作ってみました 」、コード解説がスクリプト部分に触れていなかったので、その解説記事を書き始めていたのですが…わずか数行のコードなのにとても長くなりそう^^;;;;; で、とりあえず中断して下書…
どうも！LSSです！！ ちょっときっかけがあり、急遽、JavaScript（とCSS）で「アナログ時計」を作る事に挑戦してみました！ アナログ時計 コード きっかけ コード解説（CSS部分） 追記：一部コード修正（2021/9/28） アナログ時計 #tokei{ position:relative…
どうも！LSSです！！ 最近、ぼーっと考えてる事について。 gridレイアウトとレスポンシブデザイン あまり、はてなブログに関係のない話（テーマ作るなら密接に関係してきそうですが）ですが、レスポンシブ対応のWebサイトを作るなら？みたいな事を考えていま…
今週のお題「眠れないときにすること」 どうも！LSSです！！ 今回はお題記事です。 読書 BGMとしてYouTubeを流す グッズや書籍の知恵に頼る！ 本当のところ、まともな対応方法は 読書 とりあえず、枕元に置いてある本を読んだりしますね。この場合、何度も読…
…謎の物体（？）がうにょうにょと うごめいていますｗ そしてそのアニメーションを書いたCSSコードも同時に出てきていますが、コードのほとんどが「一見、でたらめに見える数字と%がいっぱい」入っていますね。 実はこれ、「一見、でたらめ」どころか「でた…
どうも！LSSです！！ ふと思いついた、CSS小ネタです。 アニメーション飾り罫 コード 使い方と仕組み アニメーション飾り罫 @keyframes dotkeia{ 0%,80%{background-position:20px 0px,60px 0px;} 85%{background-position:20px 0px,20px -10px;} 90%{backgr…
どうも！LSSです！！ マスクが手放せない日々が続いていますね。 うっかり風邪も引けない昨今、ワクチン打ったら副反応で発熱やだるさに見舞われますが、ふと、昔聞いたこの曲を思い出しました。 クスリルンバ 効能（※個人の感想ですｗ） 今日ググってみて驚…
どうも！LSSです！！ もう４か月も前になりますか。 【JavaScript】続・自動生成迷路 - Little Strange Software というスクリプトを書いていました。 タイトル通り、自動的に迷路を生成するスクリプトでしたが、生成して表示するだけのものでした。 で、今…
どうも！LSSです！！ この記事は、JavaScript初学者向けの記事となります。 先日の記事、 は、CSSを用いた枠線（囲み枠）のコードを生成するツールでした。 そのツール自体のコードはJavaScriptで書いていましたが、今回はそのコードの公開です。 ついでに、…
どうも！LSSです！！ 三連休初日でしたが、皆様いかがお過ごされましたでしょうか？←日本語大丈夫か？ｗ 自分は、というと、職場関連でなんやかやハードな週だった事もあってか、がっつりＡＭ１１時まで寝てましたｗ それでもまだ疲れが残ってるようで、日中…
どうも！LSSです！！ 久々に「コード生成ツール」を作ってみました。 この記事の画面上で色を選んだりスライダーで角度やサイズを調整する事で、しましまの囲み枠のコードを生成する事ができます！ しましま枠線メーカー 使い方 あとがき しましま枠線メーカ…
どうも！LSSです！！ この間、中古のiPhone7を購入しました。 購入目的としては、iPhoneのブラウザに独特のクセがあるところから、このブログで書いてきたコードが一部見え方が違ったり動作に支障があったりするので動作確認用に…と。 さて、買ったはいいも…
どうも！LSSです！！ 先日の記事で、 を試した際に、double（二重線）で指定した枠線部分も奇妙に歪んだりしていました。 枠線の種類は solid double dotted dashed inset outset ridge groove と多数ありますが、この変わったborder-radiusと組み合わせた場…
どうも！LSSです！！ このブログを開設したのが、2019/9/14。 早いもので、丸二年が経過しました^^ こよみモード ブログの概要 この1年で得たWeb周りの知識で最大のもの んで、３年目に突入です！ こよみモード はてなブログの「こよみモード」はどうなるの…
どうも！LSSです！！ 自分がブログを始めてから、もうすぐ二年が経とうとしています。 その間、色々なブロガーさんと知り合い、たくさんの記事を読ませていただいています。 そんな中、割と初期の頃に知り合った方で「なお吉」さんという方がおられ、DIYで机…
どうも！LSSです！！ 今日は、ちょっと目的があって三宮をぶらついてきました。 まずは腹ごしらえ！ 続いて向かうは さんセンタープラザ 調査開始！ 初iPhone！ 触ってみた感想 ブログの動作確認 まずは腹ごしらえ！ まずは昼食です。 ランチメニュー「大盛…
どうも！LSSです！！ CSS等の動作テスト用iPhoneが欲しいなーと思いながら、未だに入手していません。 iPhoneの標準ブラウザ「Safari」がいくつかのCSSの実装が間に合っていなかったり、解釈が違ったりするから、なんですが、また新たにこのブログで使ってい…
どうも！LSSです！！ 【CSS】カードをめくる その３ idを使わない版 - Little Strange Software の改変で、表面・裏面とも画像にしてめくれるものを作ってみました。 コードの簡略化、class名を１つにまで削減などを行っています。 参考記事:チェックボック…
どうも！LSSです！！ かれこれもう長い間、ほとんどテレビを見ない生活を送っています。 子ども時代にはまぁ普通に見ていたのですが（あまり普通じゃない見方をしていた可能性も？）、テレビ番組にはCMがつきものですね。 意匠をこらし、TV局に膨大なスポン…
どうも！LSSです！！ ふと思いついて、これまでに試した２つの小ネタを合体させてみました。 小ネタ＋小ネタ＝あわせても小ネタ、って感じですがｗ こんな枠、どうでしょう？ コード 元ネタ CSS部分ちょこっと解説 あとがき こんな枠、どうでしょう？ と、単…
どうも！LSSです！！ チェックボックスとラベルの話【HTML編】 の続き。 チェックボックスとラベルを紐づけたところで、それに対してCSSから効果を与える方法について書きます。 CSSセレクタについての話が中心になります。 こっちあっち この仕組みを使うと…
どうも！LSSです！！ はてなブログには、キーワードリンクの機能があります。 普通に記事中に、どこかの誰かが登録したキーワードが入っていると、自動的にその意味を解説するページへのリンクになる機能ですね。 実際、この「はてなブログには、キーワード…
どうも！LSSです！！ 今までさんざんborder-radiusを使っていましたが、今さらになって新たに見つけた事がありました！！ ほんと今更ｗｗｗ サンプル コード その他サンプル サンプル かなり今更感がありますが、border-radius（角丸）って縦横別々に指定で…
どうも！LSSです！！ 今回は、「HTMLやCSSを使った仕掛け作りに挑戦してみたい」方向けの記事となります。 HTMLでWebページ上に配置できるもののひとつに「チェックボックス」があります。 （←こういうものですね） クリックするたびに オン／オフ が切り替…
今週のお題「爆発」 どうも！LSSです！！ はてなブログのお題「爆発」…にかこつけたCSS小ネタです^^ 爆発しますよ コード keyframesアニメーションも慣れてくると はてなブログのお題が… 爆発しますよ @keyframes bkhta{ 0%,70%{text-shadow:none;} 71%,100%…
どうも！LSSです！！ 先日の記事、【CSS】回転＋移動＝渦巻き？【実験作】にいただいたコメントを元に、別バージョンを作ってみました。 文中の一部が渦を巻く コード いただいたコメント 文中の一部が渦を巻く こちらは、Little Strange Softwareという名称…
どうも！LSSです！！ 以前、Windows11が発表された時に、 little-strange.hatenablog.com って記事を書いていましたが、ついにリリース日決定のニュースが出ました！ pc.watch.impress.co.jp 10月5日リリース、無償アップグレードも同日開始！ あと、すっか…
