この画像にはアクションを追加します ユーザーが赤い点の上を飛ぶと、情報が表示されるか、クリック(ブートストラップからモーダルになる)が表示されます。私はブートストラップを使用しており、イメージ上にdivを広げても正常な結果は得られません。私はそれが敏感であることを望む。何か案は?リンクhtml cssと画像
答えて
Iは、私はロードマップ上にランダムに、このドット配置(私は赤ドットの背景画像にボタンを作った)Photoshopで赤い点を削除した後、純粋なHTMLを使用してそれらを追加することによって、問題を解決し
javascriptのonhoverメソッドがhtml domにあるはずです。
<div id="point1" onmouseover="doHover('point1', true);" onmouseout="doHover('point1', false);"></div>
これはhtmlと画像をリンクする方法です) –
divを各ポイントに追加して「非表示のボタン」として使用すると、 – COOLGAMETUBE
がわかります:)問題は赤い点を超えるdivを修正することです –
だから、あなたはdivタグに問題がありますか?
function doHover(id, bool) {
var obj = document.getElementById("hoverPoint"+id);
if(bool) {
obj.style.backgroundColor="green";
}else {
obj.style.backgroundColor="blue";
}
}
.hoverPoint {
position:absolute;
top: 0px;
left: 0px;
width:100px;
height:100px;
display:block;
background-color: blue;
opacity: .6;
}
#hoverPoint1 {
top: 130px;
left: 135px;
}
<img src="http://i.stack.imgur.com/sUTxI.png" style="width:777px; height:292px" />
<div class="hoverPoint" id="hoverPoint1" onmouseover="doHover(1,true);" onmouseout="doHover(1,false);"></div>
- 1. CSS JSドロップダウンメニュー:画像リンク
- 2. 画像を移動した後、HTML + CSSの画像リンクが機能しない
- 3. captcha htmlページの画像リンク
- 4. HTML背景画像リンク
- 5. HTML、CSS、画像応答ウェブサイト
- 6. HTML/CSSモザイク画像ギャラリー
- 7. 画像のテキストはCSSとHTMLのみ
- 8. HTML/CSS:画像リンクの一部が別の画像リンクで覆われていません
- 9. laravelのCSS画像URLをリンクする
- 10. CSS/HTMLの初心者:画像と(CSSの)ボーダー
- 11. PHP画像がHTMLへリンクします
- 12. グライド画像ローダーとHTTPSの画像リンク
- 13. HTML/CSS繰り返し+画像ヘッダー
- 14. まず画像のhtml/cssの
- 15. HTML/CSSリスト画像の問題
- 16. html css - 画像選択の背景色
- 17. CSSと画像スプライト
- 18. 画像とテキストのCSSカードオーバーレイ
- 19. CSS - リンクとテキストを使用した画像オーバーレイ
- 20. 電子書籍のhtmlとcss画像とテキストの整列
- 21. 画像をHTMLとCSSでボタンとして使用する
- 22. HTMLとCSSの画像のレイヤーと位置付け
- 23. HTML画像タグと
- 24. 画像ボタンwith css
- 25. リンクと画像の結合
- 26. 背景画像とのリンク
- 27. 画像のCSS属性をHTML CSSに変換する方法
- 28. HTML/CSS/JS - クリック時の画像とテキストの変更方法
- 29. 画像との相対的なHTML/CSSテキスト
- 30. C#windows service:画像、CSS、JSをレスポンスとして持つHTMLページ
おそらく、カーソルが位置している座標を画像と比較して確認することで可能です。それが正しい場所にあれば、ポップアップをしますか? –
これにはjavascriptが必要ですか?そして多くの仕事はありませんか?) –
あなたはおそらく、特定のポイントでdivオーバーレイを追加して、そのオーバーレイのホバーを追加する方がいいでしょうか?EDIT:誰かがすでにそのLOLで答えています –