子供の写真をMacでスライドショーに

スライドショーを作成するにはiPhotoと使います。

先ずは、画面右下の『追加』より『スライドショー』を選び名前を付けましょう。

次に、iPhotoに読み込まれてる写真をスライドショーにドラッグします。

画面右下の、『テーマ』『ミュージック』『設定』の設定を行います。

まずは『テーマ』から、スライドのエフェクトを選択します。私はスライドパネルを良く使います。

ミュージックは、ituneに読み込まれている音楽をバックミュージックとして利用出来ます。『スライドショー用のカスタムプレイリスト』を使えば、複数の音楽を利用出来ます。

最後に『設定』ではスライドの間隔等を指定出来ます。10秒程度がちょうどいい感じです。

最後に『書き出す』ボタンで『サイズ：大』を選びます。DVDの解像度は720*480(9mbps前後)なのでそれ以上の解像度は無意味です

あとはiDVDで書き込めば終了です。

modo601 ポリゴンカット

エッジをまたいでポリゴンをカットする方法です。

Freeway テーブル_セルをもっと詳しく

まずFreewayで300×300のテーブルを作成しました。(アイテム名はitem1です)

HTMLはこうなります。

このままだと何も表示されないので、テーブルのborder(枠線)を2に変更します。

外枠2pxのテーブルが表示されました。

次に、このテーブル下記のように縦に2分割してみたいと思います。このようにテーブルアイテムの中に作成されたマスの事を『セル』と呼びます

HTMLはこのように記述します。<td>タグをもう一行加え、2つのセルのwidthの合計が、テーブルのwidth以内に収まるようにします。ついでに、右側のセルの色を赤にしてみましょう。該当セルの<td>タグの中にbgcolor="RED"と追記します。

次に横3列に分割してみたいと思います。

<tr>を2セットコピーして、hightの合計をテーブルアイテムのhightに揃えます。150+50+100=300px

セルに数字を入力してみると、とて理解し易くなります。

このように入力します。

3番と5番のセルを結合してみましょう。

基本となる3番のセルにrowspan="2"と加えます。ちなみに3つのセルを結合する場合はrowspan="3"にします。5番のセルの一行は不要になりますので削除します。

コンセント式のマグカップウォーマーを購入 Mr.coffee

仕事柄座っての作業が多いのですが、その時に欠かせないのがコーヒーです。
結構チビチビ飲むのが好きなのですが、すぐ冷めてしまいます。暖める必要は無いが、せめて冷める速度を遅く出来ないものかと思い色々調べてみました。
ステンレス製のフタ付きマグカップがはやっているようですが、あまりにも風情が無い....。やはりコーヒーカップで飲みたいので、プレートタイプでマグカップを底から暖めてくれる商品を探してみました。

まず最初に見つけたのが、パソコンのUSBから給電し暖めるタイプのもの。これが全然暖まらない、とにかく酷い。プレート部分を触っても、ほんのり暖かい程度.......。これは冷えた指先を暖める商品なのか？？。十分に機能を果たしていない製品を販売するメーカーに怒り！です。速攻ヨドバシカメラさんに返品しました。

次に見つけたのがコンセント式で、これが非常によい！！。USBと違いコンセントから直接電源をとるため、12Vと非常に強力。プレート部分も触ると非常に熱い！飲み物を暖めるとまではいかないが、冷める速度をかなり遅らせる事が出来そうです。プレート部分は85φと大きなマグカップも余裕で置けます。(本体寸法は125φ)　Mr.coffee マグカップ保温器

一つだけ注意が必要なのが、並行輸入商品ということだという事。つまり海外製品を輸入して販売しているだけということで、具体的にはコンセントの形状に少し注意する必要があります。日本のコンセントと形状が全く違うわけでは無いが、写真のように端子の片方が若干大きくなっている、いわゆる『有極性(アース付き)』のプラグピンになります。壁のコンセントであればほとんど使えると思うのですが、ケーブルタップなどの『無極性』のプラグピン対応機器の場合は使えません。

こちらの商品ですが、国内ではamazonでのみ販売しているようです。

Freeway テーブルセル内の長すぎる文字を省略

必要に迫られたので、忘れないようにメモしておきます。
本来セルの中にAが30個表示されるはずですが、<div stayle>にoverflow:hiddenとしてあるので、width200pxを超える文字は省略されます。

結果このような表示に

Freeway 長過ぎる文字にスクロールバーを設置 その2

前回overflowを指定する方法を記述したが今回は、縦軸と、横軸を別々で指定する方法です。方法はとても簡単で、

横方向　overflow-x

縦方向　overflow-y

で指示するだけ。例えばoverflow-xを『hidden』とし、overflow-yを『scroll』とすれば縦方向だけにスクロールバーが表示される。

さらにoverflowプロパティーを『hidden』と指定してボックスに収まらない文字が有る場合に省略符号『......』を表示する事もできます。ただし、横方向に文字が収まらない場合だけに有効です。

方法はoverflow :hiddenとし、さらにwhite-space :nowrapを加えることであふれた文字が改行されなくなります。

さらに、text-overflow:ellipsisを加えるとあふれた文字が『.....』置き換わります。しかしtext-overflowはIE6以上でしか対応していません。したがってsafariでは-webkit-text-overflow

Operaでは-o-text-overflowと記述します。

このようになります。

サンプルHTMLソース

<div id="PageDiv" style="position:relative; min-height:100%; margin:auto; width:980px">

<div style="position:absolute; left:39px; top:75px; height:100px; width:300px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-text-overflow:ellipsis; -o-text-overflow:ellpisis " >

文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字

</div>

</div>

Freeway 長過ぎる文字にスクロールバーを設置 その1

300×100pxのHTMLボックスの中に沢山の文字を書いてみました。当然ボックスから溢れ出て文字が表示されてしまいます。

今回はこのような問題をスクロールを設置する事で回避してみたいと思います。
まずはHTMにどのような記述をすれば良いのかを理解しましょう。この状態でのHTMLはこうなります。style属性に、overflow(溢れた文字を)visible(表示)という指示がされています。

次に、属性の、overflowプロパティーを『visible』から『hidden』(非表示)と指定すると、ボックスからあふれ出す文字が表示されなくなります。

しかし、これだと溢れ出た文字を見る事ができません。そこでスクロールバーを設置してみたいと思います。『overflow』の後を、:scroll; width:300px; height:100pxとします。

これでwidth:300px; height:100pxのボックスに対してスクロールバーが設置されます。

表示はこのようになります。ボックス右側にスクロールバーが表示されましたね。

しかしこの設定だとボックス内に収まる文字数でもスクロールバーが表示されてしまいます。あくまで文字があふれてしまった場合だけスクロールバーを表示させるには、overflow:scrollをoverflow:autoにします。

Freeway HTMLの記述を考える3

もう少しHTMLを紐解いて理解を深めていきましょう。

まず、2つのHTMLアイテムを作成し、1つの文字をセンターに設定してみます。

パブリッシュしてHTMLを見てみます。

文字の中央寄せを指示した事により、style1というスタイルが作成され、HTMLアイテムに適用されています。スタイル部分を見てみると、.style1{text-align:center}と定義されています。
もう一つ注目すべきは、<p>タグに記述されているという事です。<div>も<span>も<p>も、グループとして定義する事に基本的には変わりませんが、<P>（paragraph_段落の略）タグの特徴として『段落を定義する』のに特化したタグと言えます。<p>を使う事により、自動的に改行されたり、段落間に適度なスペースが入ったりします。その他に

1. インデントを作成できる
2. 行間を指定できる
3. 文字間隔を指定できる

などの設定が行えます。

Freeway ハイパーリンクCSSその2

ハイパーリンク設定時の文字の装飾に関するスタイルの記述の方法を記録しておきます。
#matchitem(頭に＃を付ける)という名前のアイテムを対象に、どのような条件で、どのような色に変化させるかが指定されています。

•  link(赤線) リンクされている事を表す
•  hover(緑線)マウスオーバーされた時の文字の色を表します
•  visited(オレンジ線)一度訪れたリンクの文字の色を表します。

Freeway リンク指定のアンダーライン

文字をクリックすると、指定のページにジャンプするハイパーリンク機能ですが、自動的に文字に下線が装飾されます。
htmlを見てみた所、ハイーパーリンクを指定した時点でスタイルにtext-decoration:underlineが追加された事によって下線が作成されます。逆に下線を表示したくない場合はtext-decoration:noneとすれば良いのです。

赤文字_下線有り
青文字_下線無し

Freewayは簡単に下線を削除できます。方法はリンクを指定したHTMLアイテム(文字じゃないよ)を選び、インスペクタのリンク＞標準の右側のボタンをonにするだけでです。

Freeway 新規ウインドウでページを開く

というアクションがあるんですが、ハイパーリンクで_blankの設定をするのとほぼ同じなのですが、事前に定義したサイズのウインドウで開く事ができます

画像をクリックするページの項目で設定したパージを新規ウインドウで開きます

Freeway アイテムをスクロールさせず画面に固定する

方法ですが、このようなページの事です。
作り方は非常に簡単で、画面右側にメニューのアイテムを作成し、インスペクタでウインドウに固定を選択するだけです。これで画面をスクロースしてもこのアイテムは動かなくなります。

Freeway キャッシュ無し

　インターネットからwebサイトを表示させるため、データを自分のＰＣへとダウンロードしますが、そのダウンロードしたデータもキャッシュと呼ばれます。これは、一度ダウンロードしたデータが再度必要となったときに、もう一度インターネットからダウンロードしなくても済むように、高速化のために存在します。

ページにキャッシュ無しのアクションを適用すると、上記のようなキャッシュの保存をしなくなります。
パラメーターにIE固定(非標準HTML)のチェックボックスが有りますが、知識不足で何の意味か分からないので、時間があるときに調べてみようと思います。

Freeway 音楽プレイヤーを設置する

Audio.jsというアクションを使います。挿入＞Audio.jsを適用しアイテムサイズを調整しましょう。あとはパラメーターで音楽ファイルを選択するだけです。

• Mobile Safari (iOS 3+)
• Android (2.2+, w/Flash)
• Safari (4+)
• Chrome (7+)
• Firefox (3+, w/ Flash)
• Opera (10+, w/ Flash)
• IE (6, 7, 8, w/ Flash)

に対応しているとのことです。

　　↓クリックしてみて！

Freeway6もうすぐリリース？

Freeway6の情報がFreewayTalkで話題になっていますね。
詳しい事はまだはっきり分かりませんが、リリース間近の憶測がとびかっていますね。
先日紹介したExhibeoのページはFreeway6で作成されたのではないかと言われています。
http://exhibeoapp.com
確かにHTMLソースを見てみると、generatorがFreeway6になっている...........

さて、どんな内容に仕上がっているのか、とても楽しみです！！