小编Iti*_*dta的帖子

在 HTML 地图中的特定位置添加叠加层

我有一个静态图像使用 HTML 地图的概念进行交互。

通过在https://imagemap.org/上传设置的图像坐标

预期行为：

悬停时应在其各自的框中显示叠加层。例如，当鼠标悬停在红色框上时，覆盖文本应该出现在红色框本身中，如果悬停在绿色上，则为绿色，依此类推。

当前行为：

覆盖文本位置不在其各自的框中。它显示在底部。为了实现这一点，我正在考虑在单击时在相应的区域标签之后附加包含文本的 div。

我的代码：

<body>
  <div class="interactive-map" >
  <img src="https://www.politicalmetaphors.com/wp-content/uploads/2015/04/blog-shapes-square-windows.jpg">
  <div class="card" style="width:40%; height: 10%;">
    <div class="card-body">
      This is some text within a card body.
    </div>
  </div>
  <map name="image_map">
  <area id="one" title="Red" coords="25,33,68,65" shape="rect" data-placement="25,33,68,65">
  <area title="Green" coords="132,30,194,67" shape="rect">
  <area title="Blue" coords="22,147,74,192" shape="rect">
  <area title="Yellow" coords="131,144,197,188" shape="rect">
</map>

</div>

</body>

Run Code Online (Sandbox Code Playgroud)

area{
    cursor: pointer;
    
}

Run Code Online (Sandbox Code Playgroud)

$('area').hover(function(){
    ????
})

Run Code Online (Sandbox Code Playgroud)

小提琴- https://jsfiddle.net/woke_mushroom/2u3kbnv9/14/

html javascript css jquery

Iti*_*dta

2020 08-27

5
推荐指数

1
解决办法

1054
查看次数

在页面上的切换选项卡和重新加载时维护动态 CSS

在我的应用程序中，用户可以选择单击按钮来更改页面的 CSS。如果用户访问页面上的另一个链接或重新加载页面，我希望所选样式应保留，即用户不必一次又一次地选择样式/主题。

我怎样才能做到这一点？

function switch_style (style){
 
    if(theme == "blue"){
        document.getElementById("test").setAttribute('style','color:blue');
    }
    else if(theme == "black"){
        document.getElementById("test").setAttribute('style','color:black');
    }
    
    }

Run Code Online (Sandbox Code Playgroud)

<button type="button" class="btn btn-dark" onclick="switch_style('blue') id="blue">Blue</button>
     <button type="button" class="btn btn-dark" onclick="switch_style('black')id="black">Black</button>
     <p id="test">SAMPLE TEXT</p>

Run Code Online (Sandbox Code Playgroud)

javascript css

Iti*_*dta

2020 07-20

3
推荐指数

1
解决办法

69
查看次数

如何在 Angular 中的 http GET 请求中传递多个参数？

我使用下面的方法在 http get 请求中传递多个参数，但它给了我一个错误 -

import { HttpParams, HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) { }

let params = new HttpParams();
params = params.append('var1', val1);
params = params.append('var2', val2);

this.http.get(StaticSettings.BASE_URL, {params: params}).subscribe(...);

Run Code Online (Sandbox Code Playgroud)

错误- 无法重新声明块作用域变量“params”

如果我更改名称，那么如何在 URL 中调用它？

作为一种解决方法，我考虑直接在 URL 中附加参数，如下所示 -

this.params1 = 'parameter1';
this.params2 = 'parameter2';
this.params3 = 'parameter3';

Run Code Online (Sandbox Code Playgroud)

http 请求 -

return this.http.get('URL/json?'+'&parameter1='+this.params1+'&parameter2='+this.params2+'&parameter3='+this.params3)

Run Code Online (Sandbox Code Playgroud)

我收到这个错误 -

Access to XMLHttpRequest at 'URL/json?'+'&parameter1='+this.params1+'&parameter2='+this.params2+'&parameter3='+this.params3' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the …

xmlhttprequest angular

Iti*_*dta

2020 05-25

2
推荐指数

1
解决办法

2万
查看次数