Chromeショートカットキーメモ
・F6またはCtrl+L:アドレスバーにフォーカス
・「Ctrl+Shift+V」でプレーンテキストを貼りつけ
・「Command」+「F」で検索をかけて次を検索する場合:Command」+「G」
2012年12月7日金曜日
2012年12月2日日曜日
2012年12月1日土曜日
2012年11月18日日曜日
2012年9月2日日曜日
2012年9月1日土曜日
Ruby on Rails 開発環境構築
Ruby on Railsの開発環境を構築するために下記の項目のバージョンアップを行いました。
・ruby
・gem
・rails
それぞれ
・sudo port install ruby19
・sudo gem update --sustem
・sudo gem install rails
ruby 1.9.3p194 (2012-04-20 revision 35410) [x86_64-darwin11]
gem 1.8.24
Rails 3.2.8
Rubyのバージョンアップの際にMacPortsもいれました。
MacPorts 2.1.2
参考:
Ruby 1.9.2 にアップデートしました
Mac OS X (Snow Leopard) に Ruby on Rails 開発環境を構築
Mac OSXで初めてのRubyを始めてみました
Mac OS X LionにMacPortsをインストールする方法
MacPortsの基本的な使い方とコマンド
・ruby
・gem
・rails
それぞれ
・sudo port install ruby19
・sudo gem update --sustem
・sudo gem install rails
ruby 1.9.3p194 (2012-04-20 revision 35410) [x86_64-darwin11]
gem 1.8.24
Rails 3.2.8
Rubyのバージョンアップの際にMacPortsもいれました。
MacPorts 2.1.2
参考:
Ruby 1.9.2 にアップデートしました
Mac OS X (Snow Leopard) に Ruby on Rails 開発環境を構築
Mac OSXで初めてのRubyを始めてみました
Mac OS X LionにMacPortsをインストールする方法
MacPortsの基本的な使い方とコマンド
2012年8月16日木曜日
Rubyの学習方法まとめ
以前、知人からRubyをすすめられたのですが、
中々重い腰を上げることができませんでした。
ようやくやっと暑さも和らいで涼しくなってきたので(関係ない)
少しずつ、スローペースで勉強を進めて行きたいと思います。
0スタートなので、まずはどこから手をつけていくか、
色々参考にしてみます。
Rubyを始めたい方向けまとめ(2011年秋版)
これからRubyを始める人たちへ
1時間でツイッターサービスを作ろう!
Rails3 と jQuery で、真面目にオシャレなエロサイトをつくってみました - h300(モチベーション用)
色々、見てみましたがやはり最初はドットインストールではじめてみたいと思います。
1日3レッスンで10日での終了を目標に。
今日からやると26日ぐらいですかね。
中々重い腰を上げることができませんでした。
ようやくやっと暑さも和らいで涼しくなってきたので(関係ない)
少しずつ、スローペースで勉強を進めて行きたいと思います。
0スタートなので、まずはどこから手をつけていくか、
色々参考にしてみます。
Rubyを始めたい方向けまとめ(2011年秋版)
これからRubyを始める人たちへ
1時間でツイッターサービスを作ろう!
Rails3 と jQuery で、真面目にオシャレなエロサイトをつくってみました - h300(モチベーション用)
色々、見てみましたがやはり最初はドットインストールではじめてみたいと思います。
1日3レッスンで10日での終了を目標に。
今日からやると26日ぐらいですかね。
2012年6月19日火曜日
日時計算 参考リンクまとめ
JavaScriptで現在時刻や今日の日付を取得・表示する
http://www.koikikukan.com/archives/2012/01/12-015555.php
JavaScript による日付・時刻・時間の計算・演算のまとめ
http://www.hoge256.net/2007/08/64.html
日付・時刻関数(PHP)
http://www.shigeweb.jp/php/project_p/?section=miniref&page=date#stamp
PHP 日付・時間関数の使い方
http://sandman.s6.xrea.com/nucleus/item-56.html
PHP による日付・時刻・時間の計算・演算のまとめ
http://www.hoge256.net/2007/08/63.html
イヌでもわかるJavaScript講座・来年をカウントダウンする
http://www.red.oit-net.jp/tatsuya/java/countdwn2.htm
http://www.koikikukan.com/archives/2012/01/12-015555.php
JavaScript による日付・時刻・時間の計算・演算のまとめ
http://www.hoge256.net/2007/08/64.html
日付・時刻関数(PHP)
http://www.shigeweb.jp/php/project_p/?section=miniref&page=date#stamp
PHP 日付・時間関数の使い方
http://sandman.s6.xrea.com/nucleus/item-56.html
PHP による日付・時刻・時間の計算・演算のまとめ
http://www.hoge256.net/2007/08/63.html
イヌでもわかるJavaScript講座・来年をカウントダウンする
http://www.red.oit-net.jp/tatsuya/java/countdwn2.htm
2012年6月17日日曜日
2012年6月14日木曜日
WordPressでカテゴリーを階層表示
メモ:
外観 > ウィジェット > SideWidget内カテゴリー
階層を表示にチェックを入れる
そのままだどカテゴリーに並ぶだけなので、インデントを入れる場合は
クラス名childrenにpadding-left:1emを追記
外観 > ウィジェット > SideWidget内カテゴリー
階層を表示にチェックを入れる
そのままだどカテゴリーに並ぶだけなので、インデントを入れる場合は
クラス名childrenにpadding-left:1emを追記
2012年6月13日水曜日
CSSでボタンをつくるのに参考にした記事
メモ
・CSS3だけで作るボタンデザインいろいろまとめ6つ
http://w3q.jp/t/2306
http://www.paulund.co.uk/create-a-css-3d-push-button/
・CSS3だけで作るボタンデザインいろいろまとめ6つ
http://w3q.jp/t/2306
http://www.paulund.co.uk/create-a-css-3d-push-button/
2012年5月20日日曜日
jquery.wookmark.jsの使い方
DL:http://www.wookmark.com/jquery-plugin
参考記事:
・[JS]高さの異なる要素をレンガ状に隙間なく並べるだけのシンプルなスクリプト -Wookmark
http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-wookmark.html
・Pinterestっぽいレイアウトを作ってみる
http://kachibito.net/web-design/pintarest-like-layout.html
メモ:
スクリプトは</body>直前に記述
<head></head>内に記述しても動かない
.containrにposition: relativeを記述
参考記事:
・[JS]高さの異なる要素をレンガ状に隙間なく並べるだけのシンプルなスクリプト -Wookmark
http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-wookmark.html
・Pinterestっぽいレイアウトを作ってみる
http://kachibito.net/web-design/pintarest-like-layout.html
メモ:
スクリプトは</body>直前に記述
<head></head>内に記述しても動かない
.containrにposition: relativeを記述
2012年5月8日火曜日
【Vim】HTMLを整形
MacVimでHTMLを整形しようとしたのですがコマンドが効かなかったので調べました。
一応、無事に解決したので備忘録としてメモ。
・Vimでインデントを整える(整形)コマンド
=
使い方:gg=G
・コマンドの有効化
MacVim > Contents > Resources > vim > vimrc
下記を追記
:filetype indent on
参考
・filetype
https://sites.google.com/site/vimdocja/filetype-html
・自分用のVim備忘録
http://d.hatena.ne.jp/kanonji/20110603/1307104375
一応、無事に解決したので備忘録としてメモ。
・Vimでインデントを整える(整形)コマンド
=
使い方:gg=G
・コマンドの有効化
MacVim > Contents > Resources > vim > vimrc
下記を追記
:filetype indent on
参考
・filetype
https://sites.google.com/site/vimdocja/filetype-html
・自分用のVim備忘録
http://d.hatena.ne.jp/kanonji/20110603/1307104375
2012年5月3日木曜日
2012年4月13日金曜日
HTML5向けのリセットスタイルシート・CSS
HTML5向けのリセットスタイルシート
【HTML5 のリセット・スタイルシート】
http://www.html5.jp/html5doctor/html-5-reset-stylesheet.html
【DL】
http://code.google.com/p/html5resetcss/downloads/list
【HTML5 のリセット・スタイルシート】
http://www.html5.jp/html5doctor/html-5-reset-stylesheet.html
【DL】
http://code.google.com/p/html5resetcss/downloads/list
2012年4月12日木曜日
Macvimの設定変更・カラースキーマの変更
Macvimの設定メモ
設定変更:
vimrc
場所(ここが分かりにくかった):
Macvim.app > (右クリック→パッケージ内容の表示)> Contents > Resources > vim > vimrc
カラースキーマの設定変更:
colorsのフォルダにxxx.vim(カラースキーマのファイル)を置く
場所:
Macvim.app > (右クリック→パッケージ内容の表示)> Contents > Resources > vim > runtime > colors
変更内容:
" 行番号を非表示 (number:表示)
set number
" 改行した時に自動でインデント
set autoindent
" Tab幅関係
set shiftwidth=2
set tabstop=2
set softtabstop=2
" ツールバーを非表示
set guioptions-=T
" フォント指定
set guifont=Osaka-Mono:h14
" カラースキーマの設定
colorscheme molokai
カラースキーマは最終的にこれに決めました。
【molokai - A port of the monokai scheme for TextMate : vim online】
http://www.vim.org/scripts/script.php?script_id=2340
・参考記事
【Vimをちゃんと使い始めてみる 】
http://hisasann.com/housetect/2012/01/vim.html
【新卒さんのための人気Vimカラースキーマランキング5+1(vim.org & github調べ)】
http://d.hatena.ne.jp/kattton/20110425/1303746056
今後も使いやすいようにいじっていきたいですが、今回はここまで。
設定変更:
vimrc
場所(ここが分かりにくかった):
Macvim.app > (右クリック→パッケージ内容の表示)> Contents > Resources > vim > vimrc
カラースキーマの設定変更:
colorsのフォルダにxxx.vim(カラースキーマのファイル)を置く
場所:
Macvim.app > (右クリック→パッケージ内容の表示)> Contents > Resources > vim > runtime > colors
変更内容:
" 行番号を非表示 (number:表示)
set number
" 改行した時に自動でインデント
set autoindent
" Tab幅関係
set shiftwidth=2
set tabstop=2
set softtabstop=2
" ツールバーを非表示
set guioptions-=T
" フォント指定
set guifont=Osaka-Mono:h14
" カラースキーマの設定
colorscheme molokai
カラースキーマは最終的にこれに決めました。
【molokai - A port of the monokai scheme for TextMate : vim online】
http://www.vim.org/scripts/script.php?script_id=2340
・参考記事
【Vimをちゃんと使い始めてみる 】
http://hisasann.com/housetect/2012/01/vim.html
【新卒さんのための人気Vimカラースキーマランキング5+1(vim.org & github調べ)】
http://d.hatena.ne.jp/kattton/20110425/1303746056
今後も使いやすいようにいじっていきたいですが、今回はここまで。
2012年4月4日水曜日
2012年3月6日火曜日
jQZoom Evolutionの使い方
「jQZoom Evolution」を使いました。
参考サイト
・jQueryを使ったズームプラグイン。ECサイトとかによさげ。jQZoom EvolutionとGalleriffic
http://sanride.com/blog/webdesign/jqueryec.php
・デモページ
http://www.mind-projects.it/projects/jqzoom/demos.php#demo1
・使い方
http://www.mind-projects.it/projects/jqzoom/index.php#howtouse
・Webデザイナーが覚えておく、代表的なライセンスまとめ
http://kojika17.com/2011/01/web-designers-have-to-remember-license-summary.php
自分用メモ
・サムネイルを含めて表示する場合は、画像が3枚必要
参考サイト
・jQueryを使ったズームプラグイン。ECサイトとかによさげ。jQZoom EvolutionとGalleriffic
http://sanride.com/blog/webdesign/jqueryec.php
・デモページ
http://www.mind-projects.it/projects/jqzoom/demos.php#demo1
・使い方
http://www.mind-projects.it/projects/jqzoom/index.php#howtouse
・Webデザイナーが覚えておく、代表的なライセンスまとめ
http://kojika17.com/2011/01/web-designers-have-to-remember-license-summary.php
自分用メモ
・サムネイルを含めて表示する場合は、画像が3枚必要
- imgタグ内:サムネイル画像
- smallimage内:メイン画像
- largeimage内:拡大画像
・リスト表示するためには、demoページ内のcssの追加記載が必要
・トップに表示する画像のサイズに合わせてズームエリアの位置が自動調整
2012年3月1日木曜日
指定個所へスクロールで移動
指定した箇所へスクロール移動を実装するために下記の記事を参考にしました。
ページトップへの移動に使われるjQueryです。
サンプルソースではページトップへの移動に使われていましたが、
今回の利用では指定した箇所へスクロール移動させたかったため、
指定先のクラス名を変更しました。
参考記事
・少しのコードで実装可能な20のjQuery小技集
http://www.webcreatorbox.com/tech/jquery-tips20/
ページトップへの移動に使われるjQueryです。
サンプルソースではページトップへの移動に使われていましたが、
今回の利用では指定した箇所へスクロール移動させたかったため、
指定先のクラス名を変更しました。
参考記事
・少しのコードで実装可能な20のjQuery小技集
http://www.webcreatorbox.com/tech/jquery-tips20/
送信時に文字コードを変換
現在制作しているサイトと利用しているショッピングカートで文字コードが違うため、サイトからテキストをショッピングカートに送信した時に文字化けが起こりました。
下記のサイトを参考にして、
送信時に(UTF-8 → Shift-JIS)に文字コードをエンコードすることで解決しました。
・文字コードの違うサイト間のPOST送信
http://warumono.at.webry.info/201110/article_9.html
下記のサイトを参考にして、
送信時に(UTF-8 → Shift-JIS)に文字コードをエンコードすることで解決しました。
・文字コードの違うサイト間のPOST送信
http://warumono.at.webry.info/201110/article_9.html
2012年2月12日日曜日
vimの環境設定
参加している勉強会でvimを覚える必要があったので環境を整えました。
参考リンク
vimの設定(タブ、自動インデント、行番号表示)
http://d.hatena.ne.jp/mtbtaizo/20080622
MacでのVim設定をまとめてみた
http://takus.me/computer/mac-vim-configure/
Vimのメモ
http://ogawa.s18.xrea.com/fswiki/wiki.cgi?page=Vim%A4%CE%A5%E1%A5%E2
下記のコマンドを入力してファイルを作成
touch ~/.vimrc
今回は、以下を設定しました。
syntax on // シンタックスカラーを有効
set number // 行番号を有効
set softtabstop=4 // インデントの幅を4文字に変更
参考リンク
vimの設定(タブ、自動インデント、行番号表示)
http://d.hatena.ne.jp/mtbtaizo/20080622
MacでのVim設定をまとめてみた
http://takus.me/computer/mac-vim-configure/
Vimのメモ
http://ogawa.s18.xrea.com/fswiki/wiki.cgi?page=Vim%A4%CE%A5%E1%A5%E2
下記のコマンドを入力してファイルを作成
touch ~/.vimrc
今回は、以下を設定しました。
syntax on // シンタックスカラーを有効
set number // 行番号を有効
set softtabstop=4 // インデントの幅を4文字に変更
2012年1月2日月曜日
イメージギャラリーの作成
イメージギャラリーを作成するためにjqueryプラグイン「prettyPhoto」を使いました。
・DL
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
・参考ページ
「イメージギャラリーの設置方法まとめ」
http://whisper.sakura.ne.jp/diary/2009/08/image-gallery.html
・DL
http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
・参考ページ
「イメージギャラリーの設置方法まとめ」
http://whisper.sakura.ne.jp/diary/2009/08/image-gallery.html
登録:
投稿 (Atom)