2016-04-20 11 views
1

デスクトップアプリケーションをwebbaseに移行したいと考えています。下の図のようなボタンダイアグラムがあります。html5とjQueryを使用してボタンの図を描く

buttons diagram
すべてのボタンはドラッグできません。私はちょうどラインとそれらを接続したい。これは愚かな質問かもしれません。しかし、私はWeb開発では新しいです。私は、HTMLキャンバスやjsライブラリを使用することができるいくつかのアドバイスを読んでいます。しかし、私はどのように、どこから始めるべきか分かりません。または、プラグインなしでhtml5とjqueryを使用すると可能ですか?
純粋なhtml5ですか? 助けてください。

+0

のための一例に言及してい下回っ? – RRR

+0

@RRRどうすればいいですか?可能であれば –

+1

デモを作成して時間を表示する – RRR

答えて

0

この問題には2つのソリューションがあります。

  1. ボタンタグとHTML5のキャンバスを使用して全体の構造を描画する必要があり、または

  2. だけのdivを作る、(あなたのイメージを配置しますか既に構造を持っている)をバックグラウンドに置き、あなたが望むところにボタンタグを絶対に配置します。

私は2番目の解決策をお勧めします。私はあなたがキャンバスを使用して、それを描く、なぜボタンのように見えるようにdivを使用することができます参照

\t \t div{ 
 
\t \t \t background: url(http://i.stack.imgur.com/Bw9Zj.jpg) no-repeat; 
 
\t \t \t height: 300px; 
 
\t \t \t width: 800px; 
 
\t \t } 
 
\t \t button { 
 
\t \t  position: absolute; 
 
\t \t  top: 57px; 
 
\t \t  left: 306px; 
 
\t \t  width: 161px; 
 
\t \t  height: 29px; 
 
\t \t }
\t <div></div> 
 
\t <button>Switch the kenator</button>

関連する問題