最近仕事関連で知ったことをブツブツ書いていこうと思う。 とても浅い理解でしか書かないので、 怖い人が来たら怖いのだけれど、 怖い人は来ないと思って書く。
あ、 古いブラウザは最初から相手していません。
一応僕の経歴を書いておきますと、 僕が初めてhtml, cssを書いたのは今年の3月。
あるwebサイトを作るという話で、 つまり趣味などを経由せずいきなり実務(今思うと本当に意味が分からない) だし、 古いブラウザーは無視して話進めれちゃうし、 cssを書くRule みたいなのも特にないし誰も何も教えてくれないしで色々とつらかった。
そんなわけで誰でも知っているようなことを存外知らないという事案が多発。(margin,padding: 0 0 0 0; の指定が時計回りというのを先月知ったんだぜ?)
特に jQuery はなんとなくでしか使っていないんで、 全然ダメって感じ。
だから常識がない人間を見るような目で見てください。
float と vertical-align は併用不可
最近の最大の衝撃。 なんで不可なのかは分かってないけど。
要素横並びの方法として、 display: table (table-cell) を活用するといい。
子供の要素にのみ指定
parent > child
こうすると孫には行かずに子供だけで済む(知らなかった自分にマジかよって言ってる)
使えそうな場面としては、 body の子供のdivタグのwidth を指定するときとか、 リストを入れ子にするときとか, ていうかいくらでも使い道ありそう。てかある。
this を使いこなせるようになりたい
$("hoge").click(function(){ -- }); と書くことが生きていれば絶対にあると思うのだけれど、 このときに this をうまく使えという話。
何を当たり前なことをと言う話なのだけど、 この this がどういうときにどう変わるのか正直よくわからない。(調べる課題なんだなぁ)
とりあえずこんな状況を考えよう;
<h3>タイトル</h3>
<ul>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
<li>テキスト</li>
</ul>
仮にこうなって居た時に、 ul を h3 をクリックするたびにtoggle させたければ;
$("h3").click(function(){
$(this).next("ul").toggle();
});
と書くとよいはず(はず) つまりクリックしたそのもの(this)をお隣のulにへ移動させて(.next("ul"))からそれをtoggleさせてね, という感じ(?)
正直いって分からない
this の親兄弟タグとか指定して遊んだりとかできそうで面白そうだなとか思っているけど、 思っているだけ。
本当に jQuery とか知ったことがないし、 やってらんないですねー
最近知ったことは随時更新していきたいと思うけれど、 あくまでも自分用のメモで誰かに役に立つと思ってません。 ていうか役に立たないでしょうね。