iPhone Xsのページで背景画像が文字の形で切り抜かれた表現があり、調べてみたらbackground-clip: textというスタイルだった。このスタイルで出来ること、出来ないことを検証してみました。
タイトルのようなことをふと思ったのでCSSのvw、vhをいろいろ試してみました。 PCは横長、スマホは縦長とまったく異なる縦横比率なために生じるレスポンシブ対応。それを実現するメディアクエリはとても便利ですが、何種類もCSSスタイルを書き分けるのは少々…
「Hellow Vue.js」の続きです。前回はVue.jsを読み込んで、「こんにちは びゅう!」という文字を表示しました。しかしながら、これだけならjQueryや生JSでもできるわけなので、もう少し進めてみる。 基本編として、チュートリアルでまず目についた「イベント…
「JSON未遂事件簿」の続きです。 JSON(ジェイソン)はJSの連想配列(オブジェクト)とよく似たとても馴染深いデータ形式。 前回はっぴいえんどアルバム情報を多次元配列にしてDOMに読み込みました。 今回はこれを外部JSONファイル化してFetch APIで読み込ん…
以前、JSで図(チャート)を作るライブラリとしてCanvasベースの「Chart.js」をGettingしてStartedしました。そのときにもう一つSVGベースのライブラリ「D3.js」も候補で考えていたのですがChart.jsと比べて少し敷居が高く感じてました。 その後、D3.jsベー…
はじめに、今回はJSONにあまり触れていません! WordPress等で日々サーバサイドやデータベースの便利さを感じつつ…そういえばJSとよく似たJSON(ジェイソン)というデータ形式があったな。これを使えばクライアントサイドでもグラフやゲームやインタラクティ…
前回、URLの後ろにつけたパラメータをフォームのinputタグのvalueに渡す方法をご紹介いたしました。その続きになります。 この時ネックになったのが、別ページへの回遊やサイト離脱です。再訪したユーザーがフォームを送信するときにはパラメータが失われて…
URLの後ろにつらつらと続くパラメータ。あれを取得してフォームのinputタグに渡す方法をご紹介。やれることはわかってて前からやってみたいと思っていた内容なので、実際に作ってみました。それでは、どうぞ!
「CSSドット絵マリオ」の続きです。前回は1点ずつチマチマと打っていきましたが、たった一人ではいささか寂しいですね。そうだ、ルイージを呼ぼう。「CSS変数」を使えば一瞬でこのマリオがルイージに変わるはず。たぶん変わると思う。変わるんじゃないかな…
昨日の「CSS文字詰め」の続きになります。カーニングで文字詰めをしたテキストに対して、CSSの「両端揃え」設定であるtext-align: justifyを併用すると、果たしてちゃんと両端揃えはかかってくれるのか?いつ調べるか?今で(ry それでは参りましょう。