flash - HTML5 を使用したスライダー コントロールの作成 - フラッシュ

Question

http://developerdrive.com/demo/slider_control/demo.htmlのようなものが欲しいのです が、フラッシュ (swf ウィンドウ) が必要です... 可能ですか?

Answer 1

何でも可能です！ここにある組み込みのスライダーコンポーネントを使用できます。

スライダーコンポーネントを使用する

まず、次のようにデフォルトの開始値を中央に設定できます。

var slider:Slider = new Slider();
slider.value = 50;

また、テキストフィールドをデフォルトで100に設定します。

someTextField.text = "100%";

変更ハンドラー関数を構成し、受け取った値に基づいて画像サイズとテキストフィールドを更新できます。

slider.addEventListener(SliderEvent.CHANGE, changeHandler);

function changeHandler(e:SliderEvent):void {
    var modifiedPercent:number = 2 * e.value;
    someImage.width *= modifiedPercent / 100;
    someImage.height *= modifiedPercent / 100;
    someTextField.text = modifiedPercent+"%";
}

パーセンテージに2を掛けて、基本的にスライダーの範囲を0から200にします。次に、画像のサイズとテキストフィールドの値を調整します（「someImage」は画像への参照、「someTextField」はテキストへの参照）。