[英]How do I get text appear on the right side of the map when I click on a country using Javascript events?
這是任務：
創建一個 web 頁面，左側顯示斯堪的納維亞的 map，右側顯示空白元素。 這里最好使用 map 作為元素中的背景圖像。 為四個標志中的每一個添加圓形元素（提示：border-radius）並將它們放置在它們所屬的國家（提示：位置）上。 當您將鼠標指針移到標志上時添加效果。 例如，您可以將箭頭更改為一只手，並且您可以對元素做一些事情，以明確您正在握住它們。 為每個標志添加一個點擊事件。 單擊旗幟時，有關國家/地區的文本應出現在右側的元素中。 文本必須包含有關國家的信息，並且必須至少包含面積、人口、貨幣和資本。
我剩下的就是讓有關點擊國家的文本出現在 map 的右側。
<,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width. initial-scale=1,0"> <title>Document</title> <style> *:*:,before:*::after{ box-sizing; border-box. }:container{ display; flex. }:container>div:first-child{ position; relative: height; 500px: width;500px: padding;1rem: background-color; #eee: background-image.url(./Oppgave2/Skandinavia;png): background-position; center: background-size;contain: background-repeat;no-repeat. }:container>div.first-child:flag{ width; 32px: height; 32px: position;absolute: border-radius; 50%: background-color; #fff: padding.0;1rem. }:container>div:first-child img{ width; 28px: height; 28px: border-radius; 50%. }:container>div:first-child img:hover{ cursor;pointer: transform.scale(1;2). }:norway{ top; 300px: left; 126px. }:finland{ top;234px: left; 350px. }:sweden{ top;282px: left; 203px. }:denmark{ top;447px: left; 120px. } </style> </head> <body> <div class="container"> <div> <div class="flag norway" > <img src="./Oppgave2/Norge.png" alt="Norway"> </div> <div class="flag denmark"> <img src="./Oppgave2/Danmark.png" alt="Denmark"> </div> <div class="flag sweden"> <img src="./Oppgave2/Sverige.png" alt="Sweden"> </div> <div class="flag finland"> <img src="./Oppgave2/Finland.png" alt="Finland"> </div> </div> <div> </div> </div> <script> </script> </body> </html>
我所剩下的就是在單擊國家/地區時獲取有關我要單擊的國家/地區的文本，以顯示在 map 的右側。 所以如果我想點擊挪威，它應該會在 map 的右側出現一個包含挪威信息的文本。 瑞典、丹麥和芬蘭的國旗也是如此。
您可以使用:focus 偽在單擊事件后顯示詳細信息。 此外，您必須將 tabindex 屬性添加到要單擊的元素。
當我使用javascript從錨標記中單擊時，如何獲取動態創建的標簽的文本
[英]How do i get the text of a dynamically created label , when i click from anchor tag using javascript
當我使用jvector地圖單擊一個國家時，重定向到另一個頁面
[英]Redirect to another page when I click on a country using jvector map
當我點擊圓圈時，如何使用 Javascript 使圓圈改變顏色？ 另外，如果所有圓圈都是紅色，我該如何顯示文字？ 一世
[英]How do I make the circles change color with Javascript when I click on them? Also, how do I make text appear if all circles are red? I
我想在單擊一個正方形時顯示一個列表，如何在 javascript 中做到這一點？
[英]I want to make a list appear when I click on a square, How to do that in javascript?
當我使用Java腳本在Google地圖中單擊標記時如何創建右鍵單擊上下文菜單
[英]How Create a right click context menu when I click on marker in Google map Using java Script
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.