2013-09-01から1ヶ月間の記事一覧

jQuery(9)

JS

Traversing add() 現在の要素集合にさらに指定した要素を追加出来る children() 条件を指定し、直下の子要素を取得できる。条件はなしでも可 closet() 条件に合う最も近い親要素を取得出来る ない場合はnoneが返る contents() テキストも含めた全子要素を取…

jQuery(8)

JS

Traversing filter() 条件に合う要素を抽出する セレクタなどはカンマ区切りで複数指定できる セレクタではなく、関数を指定することも出来る is() 条件に合う場合はtrueを返す 逆の場合はfalseを返す map() jQueryオブジェクトが持つ要素集合を、elementな…

jQuery(7)

JS

Attribute html() HTMLを文字列として取得する html(val) 要素にvalをセットする text() 要素がもつテキストを取得 test(val) 要素にテキストをセット val() 要素がもつvalue値を取得 val(val) 要素no valueにvalをセット

jQuery(6)

JS

Attribute addClass() クラスを追加する removeClass() クラスを削除する toggleClass() クラスがなければ追加し、あれば削除する toggleClass(name,switch) switchがtrueであれば追加する。falseであれば削除する

jQuery5

JS

Attributes attr(name) 属性の値を返す <div id="test" class="test"></div> $(function(){ $('#test').attr('class');//testを返す }) attr(key,value) 属性名と、値を指定し、要素に設定する <div class="test"></div> $(function(){ $('#test').attr('id','test');//id="test"が設定される }) 複数指定の場合は以下の…

jQuery4

JS

Selector :hidden 非表示の要素 :visible 表示されている要素 :animated アニメーション中の要素使う頻度は高いと思います。

jQuery3

JS

プラグイン jQuery.fn.extend() プラグイン作成の時によく使います。 <ul> <li>test</li> <li>test</li> <li>test</li> </ul> jQuery.fn.extend({ color:function(color){ return this.css('color',color); } }); $(function(){ $("ul li").color("red"); }); liの文字がすべて赤になります。プラ…

jQuery(2)

JS

オブジェクト操作 eq() エレメントの集合から、指定したポジションのエレメントだけを取り出す。 <ul> <li>test1</li> <li>test2</li> <li>test3</li> <li>test4</li> <li>test5</li> </ul> li.eq(2).css('color','red'); この場合は「test3」だけが赤くなります。これも良く使いますねー!

jQuery

JS

復習を兼ねて、jQueryのリファレンスを参考に命令などをメモ オブジェクト操作 each() 合致するすべての要素に対して関数を実行する。 関数内で戻り値にfalseを設定した場合、ループは終了する。 <ul> <li>test1</li> <li>test2</li> <li>test3</li> <li>test4</li> <li>test5</li> </ul> $(function(){ $('li').eac…

Adobe Source Code Pro | コードを描くためのコード!

web fontにもある、Adobe Source Code Pro 無料でダウンロードも出来るので、お使いのエディターに指定することが出来ます。自分はsublime textなので、今回はsublime textでの設定方法! フォントをダウンロード→FAQs about fonts | Adobe Typeフォントをイ…

単純に画像のスライドを無限にループさせる

CSS

スライドさせたい画像を一枚の横長の画像にします。 これを、cssで背景画像に指定し、css3のanimationで画像の横幅分、スライドさせるように 指定するし、infiniteの指定をすると、無限にループしてスライドできます!画像のクローンを作って、繋げてとかい…

今度、アプリ開発をしてみようと思う

プログラミングの練習も兼ねて、iPhoneアプリの開発を学び始めようと思っています。 今すぐではなく、サイト制作などが終わってからですが。今気になっているサイトがこちらです→Cloud-Powered HTML5 Hybrid Mobile App Development Tools | MonacaiPhoneア…

animationを使った簡単なスライドショー

CSS

とても簡単だったのでメモ 今回はchrome向けのみのコードですので 他のブラウザの場合はベンダープレフィックスを付けてください。デモ|http://yuto-m.sakura.ne.jp/admin/assignment/css/animation_slideshow/index.htmlHTML <div id="slideshow"></div> CSS #slideshow{ width: 800p…

WordPressメモ

WP

関数 オリジナルテーマでウィジェットを表示する際は、functions.phpを作成し、テーマフォルダに保存。内容に ウィジェットを表示。複数の設定をしている場合は引数に数値を入れることで差別可できる ~…

vimにemmetを導入

vim

これから、少しづつ慣れていこうと思っているので、vimにemmetを入れて便利にしてみました。GitHub - mattn/emmet-vim: emmet for vim: http://emmet.io/でemmetをダウンロード。 今回はDesktopに回答しました。フォルダ名は「emmet-vim-master」です。まず…

便利なEmmet(Zen Coding)

osはmac エディターはsublime text です。 ホント便利なEmmet。その中でもよく使うコマンドを紹介例えば #header>h1+p^#content+#footer と入力してctrl + e と打つと、なんと <div id="header"> <h1></h1> <p></p> </div> <div id="content"></div> <div id="footer"></div> と表示されます!もっと便利な方法は ul>li.num$*5 と入力して、ctrl + e …

さくらインターネットのデータベースにmacのターミナルからssh接続してみた

さくらインターネットや、macのローカル開発環境であるmampであればデータベースをいじる際、phpmyadminを使用すれば簡単に設定できるが、ターミナルからいじれるようになれると、何かと便利かと思うので、さくらインターネットのデータベースにssh接続して…

Wordpress

WP

就職用のポートフォリオサイトはWordPressで作ろうと思っていたので、頑張って勉強していきたいと思う。 また、忘備録として頻繁にブログを更新出来たらなと思っている。(たぶん) 設定 設定での、パーマリンク設定はSEO的にとても重要だということなので、…

Adobe Brackets

軽量なテキスト・エディターがあったのでご紹介します。 たまたま、知ったのですが、sublime textのようなエディターです。Brackets - A modern, open source code editor that understands web design. sublime textと違うところは、日本語対応ということで…