タグ

Adobe EdgeとHTMLに関するchokuchokoのブックマーク (2)

  • HTML上で直接CSSを編集!次世代エディタEdge Code | DECONCEPTER

    HTMLコーディングの次世代標準機能を備えるエディタ 先日紹介したAdobe Edge Tools & Servicesのエディタ担当Adobe Edge Codeを紹介します。対応OSはWindowsMac OS Xで現在プレビュー版で無償で使うことができる。 先行して公開されているオープンソースプロジェクトBracketsをコアに採用しており、革新的な機能が備わっている。次世代エディタの標準となりそうな機能の解説を盛りだくさんでみていこう。 尚、ショートカットはMacベースで説明します。Winの方は適宜CmdをCtrlに読み替えてください。 HTMLファイル上から各タグのCSSを直接オープン これは感動的過ぎる。HTMLファイル内のスタイルを編集したいタグにカーソルを合わせ、Cmd + Eを叩くと、なんと直下にCSSの定義が呼び出されて表示される。奇跡だ。 なぜこの機能を今まで他のエ

  • HTML5でFlashに近づけるか?Adobe AnimateをJavaScriptで制御する | DECONCEPTER

    手軽なHTML5アニメーションを作るならこれがベストかも 前回Adobe Edgeの雑感を書いたが、今回は実際にEdge Animateを使ってみる。アニメーション自体を作るのは簡単だが、クリックしたら再生など、ちょっとしたインタラクティブ性を加えるにはJavaScriptの記述が必要になる。手順としてまずAdobe Animateでアニメーションを作り、さらにJavaScriptで制御してみたいと思う。 今回作るサンプル 単純なサンプルではあるが、PLAYボタンを押したらアニメーションが開始し、ボタンの状態をPAUSEボタンに変化させるトグルボタンの実装と、アニメーションが一回再生されるごとにカウンターの数字が上がっていくサンプルを作る。 デモ Edge Animateで作られる要素 コンポジションとシンボルの2つの考え方で構成される。Flashで言うところのStageとMovieCli

  • 1