青いやつの進捗日記。

べんきょうのしんちょくをかいていきます。

HTMLCSSで画像のトリミング、最適解はHTMLのタグにstyle属性でbackground-image。

tech.motoki-watanabe.net tech.motoki-watanabe.net とか色々やりました。HTML側で画像を指定したほうがいいと。 しかしtransition効かせたいとかの場合、imgタグで書いてると出来ない。 結局は最適解はHTMLのタグにstyle属性でbackground-imageですね。

jQueryで関数呼び出すときにfunctionの中に関数を呼びださないとイベント起きなくてもいきなり関数動き出す。

jQueryで関数を作って、他のところで呼び出すときの注意。 teratail.com この記事に似ています。 function changeImg(imgNum) { } って関数を作ります。 で、この関数をクリックで呼びます。 $(".thumnail").click( changeImg(1); ); でいけると思ってたんで…

Webで画像のトリミング、backgroundを使わずに、今度はobject-fit。

tech.motoki-watanabe.net とか書いといてあれですが、 画像をCSSでBackgroundで指定する方式は単純なプロジェクトならばいいものの、画像はそもそもスタイル定義というよりコンテンツ定義で、HTML側で指定したほうが良いケースが多い、と指摘を受けました。…

HTMLで「1つのタグにidを複数指定」は出来ない!

<div id="imgTop js-imgTop"> みたいなこと出来るのかな、と思いやってみたら出来ない。 なんでかなーと思い調べてみると teratail.com 出来ないんですね、Classでは出来るということを知っていたのでidも同じ挙動かと思っていました…! <div id="imgTop" class="js-imgTop"> というわけでこんな感じにしました。 ちなみにな</div></div>…

jQueryの最初の $(function() { } って何ってところからスタート。

qiita.com techacademy.jp まずつまずいたのはJavaScriptをjQueryで書いてもなぜか動かない。 →これはHTMLでJSの読み込み順序を間違えていて、 jQueryを読み込んでから自分のJSを読み込まないとjQueryを使えない。 $(function() { } ってjQueryで書くのはな…

CSSで画像のトリミングをする際にどれが良いかな

style01.net どうやら3つあるらしい。 今回は、これの1つ目の手法である 「画像をBackgroundとして使う」 で実装した。 $imgWidth: 1200px; $imgHeight: 400px; background: url(./img/img1.jpg) no-repeat; background-size: cover; width: $imgWidth; heig…

VJの時にMacbook Proが限界なのか動作が重くなってきたので、TG PROを使ってMacのファンをコントロールして動作軽くしていく

sawayakatrip.com このサイトを参考にやっていきます。 なんでこれやるかって、なんか今までと同じことしようとしても映像再生の際にMacがカクつくようになりまして。で、Twitterになんで〜〜ってツイートしたらMacのファンコントロールのアプリを入れたら良…

CSSをそのまま書くよりSassを使いたいのだが、Sassのインストールでエラー「ERROR: Failed to build gem native extension.」

qiita.com この通りやろうとします。 MacなのでRubyは入ってるので、Sassのインストールを試みる。 まず普通に gem install sass しようとしたらエラー。Permissionがねえよと。 ERROR: While executing gem ... (Gem::FilePermissionError) You don't have …

Adobe XD でシンボルを使って同じような部分を一気に編集する

Adobe XD の機能にシンボル、があります。 blogs.adobe.com blog.maromaro.co.jp で、これ使ったら同じようなパーツは一気に編集できる! と思ってたらなんか同期して勝手にやってくれるわけじゃないんだな…と。 いや、厳密に言うと「色」「位置」とかは同期…

Adobe XD のアセットの使い方がカラーだけ少しわかった

これです。Command + Shift + Y でレイヤーからアセットに表示が変わります。 こうやって今回はNavBarを選択し、 アセットのカラーの右上のプラスを押すと、カラーにそのNavBarの色が追加されます。 これ以降、パーツを選んでアセットのカラーの色の部分を押…