問題タブ [imagemapster]

ロールオーバー イベントと、クリックした状態を返すクリック イベントを備えた、米国の地図である jQuery ライブラリまたはプラグインを探しています。Flash ではよく見かけますが、jQuery では見たことはありません。

誰もこのようなことを知っていますか？

jquery-plugin mapster を使用してイメージマップをセットアップしました

コードは、どの国がクリックされたかを示しています（エジプトの場合は「1」、リビアの場合は「2」..）

私の問題: 次のようなさまざまな国のループでユーザーに尋ねたい: 「エジプトをクリックしてください」

「チュニジアをクリックして」……

このループをコーディングする方法がわからないため、ユーザーは最初の国を尋ねられ、ユーザーが国をクリックするまでプログラムは待機し、次にユーザーは2番目の国を尋ねられます....

ありがとう

カート

jquery-plugin imagemapster を使用してイメージマップをセットアップしました。 すでにクリックされた後、イメージマップ内の領域をクリックできないようにする方法のヒントを教えてください。

次のことを試しましたが、うまくいきません。

ページに同じイメージ マップのコピーが 2 つあります。それらは異なる ID を持ち、同じ画像ファイルとマップ情報を使用します。

最初のマップを強調表示\クリックすると、2 番目のマップのみが正しく機能するようになりました。変更は、両方ではなく、2 番目のマップにのみ適用されます。

両方のイメージ マップを同期させる必要があります。そのため、マップの 1 つをマウスで移動したりクリックしたりすると、強調表示と選択が両方で同時に機能します。

これどうやってするの？

私のページの先頭のコード:

私のページの本文のコード:

ImageMapsterを使用して画像のサイズを変更し、「画像マップ」の座標を新しいサイズに変更しています。サイズを変更している画像は背景画像として使用されるため、画面の中央に配置されます。

CSS：

block_contentは、画像のコンテナdivです。

私はこの例のコードを使用しています：http：//jsfiddle.net/JpgYm/8/

問題は、を使用するtext-align: centerと、座標が画像に正しくマッピングされないことです。それらは画像と同じ線上に水平にありますが、少し左にずれています。

これを修正する方法はありますか？

選択された領域を作成するにはどうすればよいですか? render_select で定義したスタイルでレンダリングされます。

と

私のために働かないでください

見つけられるものはすべて読みましたが、単純なものを見落としている可能性があります。キャンパスの地図があり、すべてが適切に強調表示され、選択されています。私が抱えている唯一の問題はこれです:クリックすると、各建物が情報バブルをポップアップします。それらのバブルには「X」の閉じるボタンがあります。クリックしたときに建物の選択を解除しようとしています。(残念ながら、ライブ リンクを提供することはできません。現在、スタッフ/学生のみがアクセスできます)。

マップの設定は次のとおりです。

等々...

セットアップ:

そして私の閉じる機能：

クローズ機能:

何か案は？何か小さなものを見落としているような気がしますが、見つけられません。

ウィンドウのサイズ変更イベントへの反応として、問題のある Imagemapster イメージのマージンを変更しようとしています。サイズの変更は完全に機能します（mapsterのサイズ変更方法を使用します）。どの要素に新しいマージンを適用する必要がありますか? 画像自体に適用すると、画像は正しく配置されますが、ホットスポットは移動しません。それはまったく可能ですか？（私はjqueryを使用していますが、javascriptソリューションも問題ありません）

imagemapsterでさまざまな領域をさまざまなスタイルでスタイル設定することは可能ですか？たとえば、私が家の計画を立てている場合、ユーザーはさまざまな部屋をクリックできます：居間、寝室、浴室、...。選択したリビングルームは赤でレンダリングし、選択したスリーピングルームは青で選択する必要があります...ありがとうKurt

動的にスケーリングされた画像を、作成中の画像マップに適合させる方法を探しています。ウィンドウサイズで画像をスケーリングするためにjqueryを使用しています：

しかし、私が作成する ImageMap は元のサイズに忠実です。ImageMapster を調べていますが、すべてのイメージマップを自動的にスケーリングする方法がわかりません。

これが対象のページです: http://www.dersuawesome.com/home/