[mac]デスクトップのドックをおしゃれにカスタマイズ「Docker」
デスクトップがおしゃれだと作業も気持ちよく出来るときってありませんか?
そんなかたにおすすめ
デスクトップのドックをおしゃれにカスタマイズする「Docker」をご紹介します。
http://wayohoo.com/mac/apps/utilities/docker.html
上記のサイトからダウンロード出来ます。
ぜひ参考にしてみてください。
デスクトップがおしゃれだと作業も気持ちよく出来るときってありませんか?
そんなかたにおすすめ
デスクトップのドックをおしゃれにカスタマイズする「Docker」をご紹介します。
http://wayohoo.com/mac/apps/utilities/docker.html
上記のサイトからダウンロード出来ます。
ぜひ参考にしてみてください。
「ノンプログラマーのためのjQuery入門」
最近jqueryを学んでいる中でとても参考になるサイトを見つけたので
ご紹介致します。
スライドでとてもわかりやすく紹介されています。
http://kachibito.net/web-design/jquery-slide-for-beginner.html
ぜひ参考にしてみてください。
2カラムやカラムのレイアウトをコーディングするときに背景などの高さを揃えたいとき
などがよくあると思います。
しかしcssだけで揃えようとするとなかなかうまくいかなかったりします。
そんなときに簡単にjqueryで高さを揃えることの出来る「heightLine.js」をご紹介します。
http://blog.webcreativepark.net/2007/07/26-010338.html
上記のサイトから「heightLine.js」をダウンロードします。
[html]
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/heightLine.js"></script>
<script type="text/javascript">// <![CDATA[
$(function(){
$(#mainculumn,#sidebar).autoHeight();
});
// ]]></script>
<div id="mainculumn" class="heightLine"></div>
<div id="sidebar" class="heightLine"></div>
[/html]
headないで「heightLine.js」とjqueryを読み込み高さを揃えたいセレクタを設定します。
そしてセレクタにクラス「heightLine」を指定します。
これで高さが揃います。
簡単に使用出来るのでぜひ参考にしてみてください。
商用可能な無料素材サイト「CG.フォト」をご紹介します。
雑誌・出版業界や広告業界などで活躍しているプロのグラフィックデザイナーが
CG加工したデザインCGの画像作品を無料でフリー写真素材として公開しています。
ぜひ参考にしてみてください。
webサイトを見るときって様々な時間に見ていると思います。
時間によって背景画像を変更したり、ちょっとした楽しみを盛り込みたいときに使用出来る、
時間ごとにcssを変更出来るスクリプトをご紹介します。
http://solidstate.jp/Others/cssChange/script_6.html
ぜひ参考にしてみてください。
本日はwebサイト制作に役立つFirefoxのアドオン「Firebug」をご紹介致します。
どのように役立つかといいますと、marginやpaddingの感覚、から、各要素にいたるまで、
ブラウザで確認出来てしまいます。
またjavascriptの動きなども確認出来てしまいます。
https://addons.mozilla.org/ja/firefox/addon/firebug/
ぜひ参考にしてみてください。
お問い合わせフォームを作成するにあたって
よりユーザーに入力しやすい形を提供するのも
お問い合わせ数を増やす事につながると思います。
そこでおしゃれな時刻入力スライダーをご紹介します。
http://d.hatena.ne.jp/kudakurage/20091219/1261207635
上記のサイトで公開しております。
是非参考にしてみてください。
最近なにかと話題のテキストエディタ「Sublime Text2」をご紹介します。
現在は無料らしくいずれシェアウェアになるかもしれませんが、拡張機能が多く
デザインもかっこいい。ぜひ一度使ってみてください。
デスクトップなんかに残ってしまう「.DS_Store」というファイル。
何度消しても気づいたらまた現れていて少々邪魔です。
そんな「.DS_Store」を消す方法をご紹介致します。
http://itunes.apple.com/jp/app/ds-store-remover/id476237254?mt=12&ign-mpt=uo%3D4
このアプリケーションから削除したい「.DS_Store」を選択し実行するだけなんと再び現れずに消えてくれます。
是非試してみてください。
macでゴミばこをからにしたかったのですが、途中で止まってしまい
そこから、2時間くらい待ってみても、止まったままでした。
あらためて再起動してから試してみても、また止まってしまいます。
なぜかわからないのですが、ゴミ箱をからに出来なくなってしまいました。
そんなときに強制的に空にする方法をご紹介致します。
なお行う際は自己責任でお願い致します。
1.ゴミ箱を空にしている途中に止まってしまったら、一度再起動します。
2.ターミナルを起動し、「chflags -R nouchg 」
※gの後ろに半角スペース
と入力します。
3.ゴミ箱を開き、削除出来ないファイルをコマンド+Aで全選択し
ターミナルへドラッグ&ドロップします。
4.再度ゴミ箱を空にするをクリックします。
これで削除できました。
なお行う際は自己責任でお願い致します。
参考
http://support.apple.com/kb/HT1526?viewlocale=ja_JP&locale=ja_JP
webサイトを引き立たせるのにスライドショーをよく使うと思うのですが
本日はマウスをあてるとイメージが切り替わるおしゃれなスライドショーをご紹介致します。
上記のサイトからダウンロードで来ます。
是非参考にしてみてください。
フォントサイズ変更機能はwebサイトのユーザーアビリティーを考えると
とても便利です。
しかしcssファイルを分けて作成するととても手間がかかってしまいます。
そんなときjqueryで簡単に設置出来るスクリプトをご紹介します。
http://web-mugen.com/javascript/jquerynochangecssfontsizechange/
とても便利なのでぜひ参考にしてみてください。
Facebookページのiframeの高さは初期状態で800pxです。
この高さを変更するためにはFacebook Javascript APIを使って変更します。
iframeに表示しているページにAPIを読み込むために、以下のタグを埋め込みます。
head内
[html]<script charset="utf-8" type="text/javascript" src="//connect.facebook.net/ja_JP/all.js"></script>
<script>
FB.init({
appId : ‘App ID’,
status : true,
cookie : true,
xfbml : true
});
FB.Canvas.setSize({ height: 1000 });
</script>
[/html]
ここで高さの設定をします。
以上で完了です。ぜひ参考にしてみてください。
サイトを丸ごとダウンロード出来るfirefoxのアドオン「ScrapBook」をご紹介します。
https://addons.mozilla.org/ja/firefox/addon/scrapbook/
firefoxで上記のサイトからダウンロードします。
是非使ってみてください。
ie6やie7のブラウザシェアはまだまだあるようです。
そこで、ieの表示を手軽に確認できるツール「IETester」を
ご紹介します。
http://my-debugbar.com/wiki/IETester/HomePage
上記のサイトからダウンロードできます。
ぜひ使ってみてくさい。
手軽に利用できる高機能なメールフォーム[メールフォームプロ]を
ご紹介致します。
http://www.synck.com/contents/download/cgi-perl/mailformpro.html
自動返信HTMLメール
文字書式チェック機能
自動返信メール
クレジット決済機能
などなどまだまだ便利な機能はたくさんあります。
ぜひ使ってみてください。
おしゃれなでlightboxのようにポップアップでフォームを表示させるプラグイン「jquery.lightbox_me.js」
をご紹介します。
http://buckwilson.me/lightboxme/
上記のサイトからダウンロードします。
ダウンロードしたjquery.ligthbox_me.jsとjqueryを読み込みセレクタを指定します。
head内
[html]
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox_me.js"></script>
<script>$(‘#try-1’).click(function(e) {
$(‘#sign_up’).lightbox_me({
centered: true,
onLoad: function() {
$(‘#sign_up’).find(‘input:first’).focus()
}
});
e.preventDefault();
});
</script>
[/html]
html内
[html]
<a href="#" id="try-1" class="try sprited">お問い合わせフォーム</a>
<div id="sign_up">
<form>
<input type="text" name="">
</form>
</div>
[/html]
ぜひ参考にしてみて下さい。
透過ピングは最近のブラウザでは対応していますがie6では対応しておらず
透明部分が灰色になってしまいます。
それが非常に見にくいので対応させる方法をご紹介します。
「DD_belatedPNG」を使とie6でもきれいに透過されて表示されます。
http://www.dillerdesign.com/experiment/DD_belatedPNG/
上記のサイトから「DD_belatedPNG」をダウンロード
[html]
<!-[if lte IE 6]>
<script type="text/javascript" src="DD_belatedPNG.js">
</script>
<script type="text/javascript"> DD_belatedPNG.fix(‘.png_bg’);</script>
<![endif]->
[/html]
head内で「DD_belatedPNG.js」を読み込み使用するセレクタを指定します。
[html]
<img src="img/sample.png" class="png_bg">
[/html]
透過したい画像にクラスをつけます。
描画処理がAlphaImageLoaderと比べて断然高速なので、ページをすぐに表示できる。
背景にリピート描画(background:repeat)が可能。
ブロック内の背景にpngを配置しても、ちゃんとリンクが機能する。
ぜひ使ってみてください。
[DTP]photoshop無料で使用できるプラグインご紹介
photoshopをより便利により使いやすく
するためにプラグインをよく使用します。
そんなプラグインがまとめてあるサイトをご紹介します。
http://cg.xyamu.net/PhotoshopElements/entry36.html
いろいろあるので是非試してみてください。