読者です 読者をやめる 読者になる 読者になる

しがない学生の雑記

吐けども吐けども毒を吐く。

jQuery戦場滞在日記1日目 装備を整える

こんにちは。本日から「jQuery戦場滞在日記」と題してjQueryのお勉強っぽいことをしたものを書いていきたいと思います。

 

プログラマの方々いわく「戦場」であるJavascriptの勉強をしようと思ったら、いつのまにかjQueryの勉強をしていました。というか、いろいろ調べた結果、おそらくWeb関連に進まないであろう私はJavascriptを勉強しても意味がなさそうだとおもいました。というわけで、今後はjQueryを使って自己紹介用スタイリッシュWebサイトを作成することを目標にしたいとおもいます。

 

とはいえ、最悪自分で何かしらのコードを書く必要はあるかもしれませんが……。

 

手始めにjQuery関連のサンプルを漁っていたんですが、想像以上に「サンプルをいじる」形になりそうです。しかもそのサンプルの量がものすごくって笑いました。こんなにあっていいのだろうか。

 

というよりも、今まで私が知っていたサンプルコードとは違って「ゆるいライセンスさえ守ればそのまま使っていいよ!」みたいな物が多いのが印象的でした。ファイルになっていてすぐダウンロードできて、しかも使い方までご丁寧に書いてあるなんて驚きでした。もともとWeb関連のサンプルコードってこんなもんなんですかねぇ。

 

しかし、jQueryを使うにしてもその為のHTMLとCSSを勉強しなければいけなかったので、急ごしらえでなんとか勉強してみました。一応、完成形となるサイトの草案も出来上がりました。

 

f:id:zyusou:20140223180930p:plain

 

3カラムでブラウザの中央にむりやり持ってきています。思いついてからここまで持ってくるのに3時間もかかるとは思いませんでした。コンパイラ通さなくても動くんだし適当にやってもすぐ直せば大丈夫だろwwwwwとか舐めかかっていました。Web関連のプログラマの皆様すいません。

 

今回参考にしたサイトはこちら。

CSSによる3カラム(3段組)レイアウト

http://www.geocities.jp/multi_column/practice/3column1.html

 

CSSで要素を画面中央に配置する方法 | hT DESIGN blog

http://htdsn.com/blog/archives/css-center-position.html

 

2つを組み合わせて自分でピクセルサイズをいじってこんな感じにしました。今のところ左がメニュー、真ん中がテキスト、右が画像と考えています。ここからようやくjQueryを使える部分ですね。しっかりサンプルを読み込んで勉強したいと思います。

 

明日は卒論の発表会なので、とりあえず今週中にもう一回更新することを目標にしたいと思います。それでは ノシ