タグ

2010年7月7日のブックマーク (5件)

  • iPhone4をFireworksで作ってみました - アシアルブログ

    こんにちは。和田です。 先日、iPhone4が発売になりましたね。 欲しいな…なんて思っているのですが、ド○モユーザーな自分には無理なんですよね。はぁ~。 はやく、SIMフリーの環境になってくれないかな…。 なんて気持ちをこめて! じゃなかった、 今後、iPhoneアプリの提案にも使えると思い、FireworksでiPhone4を作ってみました。 ステップ-1~10にまとめたので、皆さんも作ってみてくださいね。 ↓出来上がりはこんな感じです。 まず1200×1600pixelのキャンバスを作ります。 ステップ-1 :ステンレススチールバンド(外枠)を作る 矩形ツールで750×1472pixel(x=225,y=64)の長方形を作り、 ・丸み:28%、 ・線形グラデーション:#8c8c8c,#cccccc,#8c8c8c ・光彩(内側):距離→2,不透明度→50%,ぼかし→1,オフセット→0

    iPhone4をFireworksで作ってみました - アシアルブログ
    sw_lucchini
    sw_lucchini 2010/07/07
    iPhone4を描く
  • iPhone向けサイト制作ノウハウ&拡張機能「iPhone site extension for Dreamweaver CS4/5」 | デベロッパーセンター

    iPhoneiPhone 3G/3GS)/iPod touchは、PC向けサイトがそのまま表示できるところが大きな魅力の一つです。しかし、小さな画面や、指で操作するとインターフェイスなどのようにデバイス特有な面も多く、PC向けサイトのままでは必ずしも見やすいとはいえません。そこで記事では、Dreamweaverを使ってiPhone向けサイトを作る時のテクニックや注意点をご紹介します。 必要条件 この記事を最大限に活用するには、次のソフトウェアが必要です。 Dreamweaver CS5 体験版 今すぐ購入 制作したサイトの表示結果を確認する方法 ライブビューでプレビューする Dreamweaver CS5(および CS4)には「ライブビュー」機能が搭載されており、ページのレンダリングにはWebKitエンジンを利用しています。iPhoneのSafari(Mobile Safari)も

    sw_lucchini
    sw_lucchini 2010/07/07
    機会があれば
  • HTML5 VideoでiPadがデジタルサイネージに! (1/6)

    iPadと外部ディスプレイを接続してデジタルサイネージに使う。HTML Videoを再生すると、動画だけがディスプレイに出力される。画像クリックでサンプルページを表示します(iPad専用) iPadが日で発売されてから1か月ほど経ちました。購入された方はどのように使っているでしょうか。 iPadの魅力は、発売前から話題の電子書籍や電子雑誌のリーダーだけではありません。PCよりも安価で小さく、操作性の良いネット端末としての特性を生かして、「デジタルサイネージ」の用途で活用できるのも魅力のひとつです。 iPadを使ったデジタルサイネージ デジタルサイネージは日語にすると「電子看板」で、室内・屋外に電子機器を利用して掲示する広告のことです。写真や文字をスライド表示したり、派手なCGや動画を表示したりと、さまざまなタイプがあります。 デジタルサイネージは、iPad体だけでも標準のスライド機能

    HTML5 VideoでiPadがデジタルサイネージに! (1/6)
    sw_lucchini
    sw_lucchini 2010/07/07
    iPadでデジタルサイネージ。VGAアダプタ買ってみようかな
  • [CSS]リンクの情報を補う、「content」プロパティのスタイリング集

    「content」プロパティを使用して、リンクの情報を補うツールチップやポップアウトを実装するチュートリアルを紹介します。 CSS Content デモページ 「content」プロパティの対応ブラウザは合わせて使用する疑似要素の「:after/:before」にも対応したFirefox3.x, Safari3.x, Chrome3.x, Opera10+, IE8+となります。 訪問済みのリンクに印をつける 訪問済みのリンクにチェックマークをつけます。

    sw_lucchini
    sw_lucchini 2010/07/07
    contentプロパティの便利な使い方
  • css3で実装するドロップシャドウの応用・めくれた感じを作り出す

    css3で新たに加えられたドロップ シャドウを使って一歩進んだシャド ウを作るTipsです。画像でよく使わ れている、めくれた際に出来る様な シャドウをcssのみで実装。 以下のようなシャドウをcssのみで実装します。 cssHTMLのソースは以下。 htmlは以下 <div id="shadows"> <article> <h3>CSS3 でめくれた感じのドロップシャドウを</h3> <p>下部の両端にドロップシャドウがあると思います。良く見る手法ですね。これを画像を使わず、css3のみで実装します。</p> </article> </div>css div#shadows { width: 559px; margin: 20px auto; position: relative; } article { background: #dcdcdc; -webkit-border-radi

    css3で実装するドロップシャドウの応用・めくれた感じを作り出す
    sw_lucchini
    sw_lucchini 2010/07/07
    box-shadowを擬似セレクタ「after・before」を使いめくれた感を出すテクニック