area.js
2.32 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
$('.detail_cont').hide()
// 字符上标
function convertToSuperscript(str) {
var regex = /[\\\\|\?]+/; // 定义特殊符号的正则表达式
if (regex.test(str)) {
return str.replace(/([\\\\|\?])/g, '<sup>$1</sup>'); // 使用正则表达式全局替换特殊符号并添加上标样式
} else {
return str;
}
}
let urlStr = window.location.href
let apilang = ''
if(urlStr.includes('English')){
// url = url.replace('English',change)
// window.location.href = url
apilang = 'English'
}else if(urlStr.includes('Chinese')){
apilang = 'Chinese'
}else if(urlStr.includes('Russian')){
apilang = 'Russian'
}else if(urlStr.includes('Spain')){
apilang = 'Spain'
}
$(document).on('mouseover', '.area', function () {
console.log($(this).attr("class"))
console.log($(this))
let id = $(this).attr("id")
$('.detail_cont').empty()
$.get(`http://www.ccdcdf.com:6080/api/index/getProductById?id=${id}&apilang=${apilang}`, function (res) {
console.log('返回的数据', res)
let data = res.data
let str = ''
// let title = convertToSuperscript(item.title)
// let description = convertToSuperscript(item.description)
// let objEncoded = encodeURIComponent(it);
str += `
<img src="../../../static/imgs/about/meeting.png" class="kuang" alt="">
<p class="area_name">${data.title}</p>
<p class="pro_time">${data.subtitle}</p>
<div class="area_detail">
<img src="${data.image}" class="area_img" alt="">
<p class="text">
${data.content}
</p>
</div>
`
$('.detail_cont').append(str)
})
$('area').css('z-index', '2')
// $(this).css('z-index','10')
console.log($(this).position().top)
console.log($(this).position().left)
$('.detail_cont').css('left', $(this).position().left - 608 + 96)
$('.detail_cont').css('top', $(this).position().top - 86)
$('.detail_cont').show()
})
$(document).on('mouseleave', '.area', function () {
$('.detail_cont').hide()
})
$(document).on('mouseover', '.detail_cont', function () {
$('.detail_cont').show()
})
$(document).on('mouseleave', '.detail_cont', function () {
$('.detail_cont').hide()
})
$(document).on('mouseleave', '.map', function () {
$('.detail_cont').hide()
})