web Archive

今日はお小遣い稼ぎにLancersのご紹介！！

キャッチコピーやロゴ、ウェブ制作などの「仕事をしたい人」と「お願いしたい人」をマッチングしてくれます。
個人間や個人と法人間で仕事を直接取引できる、仕事のマーケットプレイス！
コンペ方式やプロジェクト形式があり両者にとって魅力的。

力を試したい人、お小遣い稼ぎがしたい人、よりよい多くの提案を受けたい企業などにぴったり。

仕事マーケットプレイス「Lancers」！！

挑戦しないことには何もはじまらない！！
まずは登録。
ランサーズ会員登録（無料）はこちら

文字を選択して…

カーニング（文字詰め）のショートカット

Command(Ctrl) ＋ ← (→)
左矢印キーを1回押すと文字間隔が1%狭くなり、右矢印キーを1回押すと文字間隔が1%広くなります。

 10%ずつ調整したい場合
Command(Ctrl)＋ Shift ＋ ← (→)

選択したテキストの行送りのショートカット

Command(Ctrl) ＋ ↑ (↓)
上矢印キーを押すと行間隔が広くなり、下矢印キーを押すと行間隔が狭くなります。

10単位づつ調整の場合
Command(Ctrl) ＋ Shift ＋ ↑ (↓)

それよりもなによりも完全に今さらなのですが…

整列する際に特定のキーオブジェクトを軸に整列させる方法が…
整列させたいオブジェクトたちを選択して、最後にキーとなるオブジェクトをクリック後、整列させたらキーオブジェクトを軸に整列する。
ってやり方で今まで出来ていた気がするのすが…
なにかしてしまったのか。はたまた出来ていたというのは気のせいなのか…？？
環境はFireworks CS3の場合です。
何かご存知の方、教えていただければうれしいです。

Help!!

Javascriptでページ内スクロールをスムーズにするするっと動かすスクリプトを使おうとしたのだが、
IE6でのスクロールダウンが極端に遅いということでXML宣言をなくすと普通に動作するらしい。

それもなんだかなーということで、
IE6はスムーズスクロールじゃなくたってリンク先にぴょんって移動すればいいじゃないか！
ということで、
IE6だけスクリプトを読み込ませない方法を探しました。

全文を読む

ステキな私好みのブログパーツを発見！！
かわいい…
きゅんっ。

ホネホネ・クロック [時計・ブログパーツ]はこちら

マウスオーバーするとズームするよ´◡`

商用でフラッシュ（swf）をライトボックス風に表示したくていろいろ見ていたのだが、
今回探すポイントとしては、
1. jQuery系プラグイン
2. 商用フリー
3. IE6対応

これが、なかなか見つからないのだ。
いろいろ探した結果報告。

shadowbox がよさそうなのだが、これは商用フリーではなく…

video lightbox これもよさそうだが、これまた商用フリーではなく…

そんなこんなでたどり着いたのが、、、

prettyphoto
ライセンス：Commons Attribution 2.5

おぉー。角丸でいい感じ。
商用でも使えそう♪
といろいろ試してみる。
いろいろ調整してみて、これならいけるかもーとちょっと喜んだのもつかの間、、、

IE6のこと忘れてた！！

チェックしてみると…
うぅぉぉー…表示がおかしい…。
だめか…
だめなのか…
もういやだ…
IEなんて大嫌い…
と、prettyphotoで結構時間を費やしてしまった…

なんか、はまるとすごく時間かかるよね。
気を取り直して翌日改めて探すことにする。

ってことで改めて探した結果、見つけたー！

その名もFancyBox
ライセンス：MIT and GPL licenses

るんるんるん♪

サンプルを参考にこんな感じで実装

<script type="text/javascript" src="./jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
 $(document).ready(function() {
  $("#spot .movie").fancybox({
   'padding'   : 10,
   'autoScale'   : true,
   'transitionIn'  : 'none',
   'transitionOut'  : 'none',
   'titlePosition'  : 'outside',
   'width'  : '320',
   'height'  : '240',
   'overlayColor'  : '#000',
   'overlayOpacity' : 0.9
  });
 });
</script>

<ul id="spot">
　　<li><a href="test1.swf" title="testmovie1" class="movie">動画1</a></li>
　　<li><a href="test2.swf" title="testmovie2" class="movie">動画2</a></li>
</ul>

cssの置き場所とかを変えるときはパスも合わせて変更する。

今回、動画の外に余白を入れたかったので、
‘padding’ : 10
を設定。

また、タイトルの表示は、
‘titlePosition’は’outside’にした。
この際の表示位置はどうやらそのページのスタイルにつられているようなので、
強制的に中央ぞろえにしたければスタイルを上書きして

.fancybox-title-outside {
 text-align: center;
}

とすればよい。

また、暗めにしたかったので
‘overlayColor’ : ‘#000′
‘overlayOpacity : 0.8
を設定。標準設定は
overlayColor : ‘#777′
overlayOpacity : 0.7

このように追加する場合は「,」を忘れないように、かつ最後に「,」をつけないようにする。
これは、ちゃんとIE6でも大丈夫！！

やったー！

と思いきや、コンテンツを既存ページに組み込むと、別のフラッシュも一緒に表示されるじゃないか…。
なんとなく記憶をたどって意外とすんなり解決。

解決方法
param name=’wmode’がvalue=’transparent’になっているかチェックし、なっていなければ設定する。

これで、無事解決！

ありがとうFancyBox！！

と思いきや、IE6だと閉じるボタンが見えない…
どうやらIE8でも。

ヌォーー…

ちょこちょこした結果、下記で解決できました。

【IE6-IE8】FancyBoxでクローズボタン（閉じるボタン）などが表示されない場合の解決方法！

jquery.fancybox-1.3.4.css
/* IE6 */以下の画像パスをルートからのパスに修正する！！

例
/js/fancybox/fancy_close.png　に画像がある場合、

fancybox/fancy_close.png
↓
js/fancybox/fancy_close.png

こんなかんじ。これで表示されるはず！

ふぅー解決できてよかったー。

アカウントを削除したかったのだが、がんばって探してみても見当たらない。

おぉいおい！

と思いつつ、googleで検索してたら削除方法（とFacebookの恐怖）を記した記事（Facebookの恐怖）を見つけ、無事に削除できた…はず。

削除したい場合は、ログイン状態で以下にアクセスとのことです。
http://www.facebook.com/help/contact.php?show_form=delete_account

ふぅー危うかった。

ってか、Facebookこわっ…
どんだけ削除させたくないんだ…。

IEのバージョン別に読み込むCSSを変える
全IE用

<!--[if IE]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

IEには対応させない

<!--[if !IE]>
<link href="style.css" rel="stylesheet" type="text/css" />
<![endif]-->

IE7のみ読み込み

<!--[if IE 7]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

IE6以下のみ読み込み

<!--[if lt IE 7]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

※lt：Less-Than。つまり、IE7は含まないのでIE6以下。

もしくは

<!--[if lte IE 6]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

※lte：Less-Than or Equal。つまり、IE6を含むので、IE6以下。

IE7以下のバージョンに対応

<!--[if lt IE 8]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

もしくは

<!--[if lte IE 7]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

IE7以上のバージョンに対応

<!--[if gt IE 6]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

※gt：Greater-Than。つまり、IE6を含まないのでIE7以上。

もしくは

<!--[if gte IE 7]>
<link href="ie.css" rel="stylesheet" type="text/css" />
<![endif]-->

gte：Greater-Than or Equal。つまり、IE7を含むのでIE7以上。

そして、こんな記事を発見。

【coliss】[CSS]条件付きコメントを使用した際にレンダリングを早くするテクニック下記CSSハックメモ

下記のように、CSSファイルを指定した箇所より前に空の条件付きコメント（<!–[if IE]><![endif]–> ）を挿入します。

<!--[if IE]><![endif]-->
<link type="text/css" rel="stylesheet" href="screen.css" media="screen, projection">
<link type="text/css" rel="stylesheet" href="print.css" media="print">

<!--[if IE]>
<link type="text/css" rel="stylesheet" href="ie.css" media="screen, projection">
<![endif]-->

ほぉー！！すばらしいですねぇ。

下記CSSハックメモ

IE8のみ適用

html>/**/body selector {
 margin-top/***/: 2px\9;
 padding: 5px;
}

2つめのプロパティからは普通に指定してOK。

IE7のみ適用

*:first-child+html selector {
 margin: 0;
}

IE6のみ適用

_selector {
 margin: 0;
}

最後に、今回、調整していたときに、IE8のみでイメージが3px下にずれて表示されてしまうのでネガティブマージンを指定（margin-top: -3px;）したのだが、うまくいかない…
うー、ネガティブマージンだめなの？と思うも、その他のプロパティだとちゃんと効く…
結論は、今回jqueryのプラグインを使用してスライドショーを実現していたのだが、そのpositionが絡んでいるっぽい。いろいろ試してはみたがうまくいかなかったのでとりあえず、!importantをつけてみたら、うまくいったのでこれでよしとした。

html>/**/body selector {
 top/***/: -3px\9 !important;
}

ふぅー…

なぜ、CS5でバリデート機能を非推奨にし、できなくなったのか…。

すっごく、便利だったのに！！

超活用してたのに！！！

もぉっ！！！！！

って思っていたところ、発見しました！

拡張機能でいけるみたいです♪

Validator for Dreamweaver CS5 (By Donald Booth) をインストールすると、Dreamweaver CS5でもバリデート機能が使えるようになります！

下記参考にしたサイトでは、拡張機能などをインストール後に、メニューバーが文字化けしてしまった時の対処方法も書いてあります！
今回私は文字化けしなかったので、そのまま使えそうです♪

【参考】
効率的なサイト制作のためのDreamweaverの教科書

テンプレートでファイルを相対パスで指定した場合、Dreamweaver側で自動的にパスを書き換えてファイルを参照しますが、うまくいかない時があるので注意が必要。

テンプレート内にJavascriptコードを埋め込んでいて、さらに引数としてファイルのパスを指定していた場合、パスの変換は行われないので要注意！！

その際は、必ずサイトルート相対パスを使ってファイルを指定する。

 が、しかし、、、

テスト環境とかだとサイトルート相対パスだとディレクトリきったりしてるから、本番環境と同じ記述だとルートの位置がうまくいかない…。

うーーーん、困った。

 とりあえず、今回は小窓を開きたかっただけなので素直にDreamweaverのビヘイビアブラウザウィンドウを開くを使う。この場合はうまくパスを変換してくれるらしい。

<a href="../hoge.html" target="_blank" onClick="MM_openBrWindow('../hoge.html','windowname','scrollbars=yes,width=600,height=500'); return false;">別ウィンドウで開く/a>

こんな感じ。
ただし、普通にメニューで「ビヘイビアの追加」で追加すると、
「return false;」が入らないので、ソースに追記することと、リンク先にURLを指定しておくことも忘れずに！

【関連記事】
JavaScriptがOFFでも閲覧できるように別ウィンドウを小窓で開く

MTOS: Movable Type オープンソース・プロジェクト

Movable Type 基本ライセンス (有償)との違いはなんだ？

下記はMT4との比較であって、MT5ではどうなっているかまだ未検証であるが…
違いを簡単に言えば、
サポートの有無とカスタムフィールドが使えるか否かということだ。

はて、どっちを使っていいものか…

【参考】
[Movable TypeをCMSとして使う] 第4回 MT4?MTOS?
MovableType4とMovableTypeオープンソース版は一応別物らしい