2021-07-20

クリップパスを使いたいんじゃ

CSS

使いたいんじゃ

CSSにはクリップパスなんていう良い感じに画像を切り抜いてくれる機能なんてものがありましてですね。僕もそういうの使って装飾とかしたいなーなんて思ったり思わなかったりしていたんですよ。だけどもCSSいじる機会ってそうそうなくて何もしないでいると記憶の中に風化してしまうのではと思ったので記事にしてメモっておくことにしました。

これな
developer.mozilla.org

使い方例にあるこのあたりによく使いそうな気がする。

clip-path: url(#myPath)

Assuming the following clipPath definition:
<svg>
  <clipPath id="myPath" clipPathUnits="objectBoundingBox">
    <path d="M0.5,1
      C 0.5,1,0,0.7,0,0.3
      A 0.25,0.25,1,1,1,0.5,0.3
      A 0.25,0.25,1,1,1,1,0.3
      C 1,0.7,0.5,1,0.5,1 Z" />
  </clipPath>
</svg>

SVGひっぱってきて画像などを切り抜いたりするやつ。そのままpathの中にもねじ込むこともできたりします。

実際に利用してみるとこんな感じ。

SVGと組み合わせて色々な形に切り抜くことができるってことで画像のカスタマイズが楽しくなるやつなんですけども、僕はSVGアートがそんな得意でないので使う機会に恵まれない……。

なんかに使いたいんだけどもねえ。

おわり

2021-07-19

急にコーディングしたくなるときがまれによくある

onlineGDB

ハローワールドしか書けないけどもコーディングしたくなるときがある

はい、おはようございます。僕です。突然ですが急にコーディングしたくなるって時あると思うんですよ。僕はハローワールドしか書けないけどもね(笑)。で、そんな時どうしたらいいかって言うとメモ帳を開いてコーディングすればいいわけです。でもメモ帳って構文が色分けされてないから3行以上書くと何書いているかわからなくなってしまうのですよね。じゃあどうしたらいいのか。

そこでコレですよ！
www.onlinegdb.com
当該のブコメにもあるように急にコーディングしたくなったときにいいらしい。んで、これが何かというとオンラインコンパイラ。

f:id:andron:20210713234333p:plain
見た目はこんな感じ

f:id:andron:20210713234210p:plain
いいものかわかんないけどもBeutify機能*1があるので急にどこぞから引っ張ってきたコードを試したくなったときなどに良いかもしれない。

あと作ったコードが埋め込める。埋め込んだときサイトの気持ちよくハマってくれる感はこれが一番いいかもしれない。まあブログにコードを埋め込むとかやる人そんなにいないだろうけども……。ちなみに、上のコードはフィボナッチ求めるやつです。

コメントは消していいんだけども以下のようなこと書いてます。

GDBオンラインへようこそ。
GDBオンラインは、C、C++、Python、Java、PHP、Ruby、Perl用のオンラインコンパイラおよびデバッガツールです。
C#、VB、Swift、Pascal、Fortran、Haskell、Objective-C、Assembly、HTML、CSS、JS、SQLite、Prologに対応しています。
世界のどこにいても、オンラインでコード、コンパイル、実行、デバッグができます。

まあ色々と対応してます。HTMLとか何吐き出すんだろうとか思ってたけどもWebで見た画面吐き出してくれるらしい。SQLiteもあるね。そっちはなんだろうね。TABLEつくってなんやかんやして使うんじゃないですかね？

まあそんなのあるんですよ。

おわり

*1:コードをきれいに整えてくれる機能

2021-07-18

リトル〇〇2やってみる。

Game

2をやろうと決心した

はい、おはようございます。僕です。今日も中身のないブログを更新していきます。

今日もですねリトル〇〇の話をしようと思ったのですよ。〇〇に入る言葉は……。そうですね、ないとｍ……アルケミーですね。

はい。
littlealchemy2.com
実は２があるということを知ったのでそれをな……やってm。やってみようと思ったんですけどもこのタイプのやつは実況というより雑談向けとかライブ配信雑談用っぽい感じがしてやめた。だけど2があるということをどこかに書きとどめておきたかったんでここに投げることにしました。

前回記事
inujini.hatenablog.com

ゲーム内容は前回に同じくこんな感じ。