Skip to content

お絵かきボードの拡大表示でサイズを固定する

by : 2017/09/01

hifiveのUIライブラリ、お絵かきボードの機能で拡大する部分のサイズを変更する方法です。

実際の動きは次の画像のようになります。デモはこちらのJSFiddleで試せます。

HTMLについて

HTMLは前回の拡大表示をベースに、拡大する部分を設定できるテキストボックスを追加します。

JavaScriptについて

JavaScriptでは拡大する部分のサイズを設定する処理を次のように書きます。

setSizeに数字を適用するだけなので、拡大/縮小ボタンのような使い方も簡単です。


デモはこちらのJSFiddleになります。ターゲットの画像によってサイズを分けるような使い方も良さそうですね。

From → hifive

コメントする

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。