Commit 77764da1 authored by 李苏's avatar 李苏 💬

动态定位dom位置调整防止重合

parent f7b2df6e
......@@ -232,6 +232,7 @@
},
methods: {
eclick(item){
console.log(item)
this.nowSelect=item
this.DialogTitle=item.code
this.$nextTick(()=>{
......
......@@ -45,7 +45,7 @@
this.$nextTick(() => {
var infoBox = this.$refs.infoBox
$(this.$refs.mx1).each((index, element) => {
element.addEventListener('mouseover', (event) => {
element.addEventListener('mouseenter', (event) => {
let info = this.boxList[index]
let content =
`
......@@ -64,9 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
console.log(event.clientY,event.clientX)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -83,30 +83,30 @@
}
},
beforeDestroy() {
$(this.$refs.mx1).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx2).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx3).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx4).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx5).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx6).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx7).each((index, item) => {
item.removeEventListener('mouseover');
})
$(this.$refs.mx8).each((index, item) => {
item.removeEventListener('mouseover');
})
// $(this.$refs.mx1).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx2).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx3).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx4).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx5).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx6).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx7).each((index, item) => {
// item.removeEventListener('mouseover');
// })
// $(this.$refs.mx8).each((index, item) => {
// item.removeEventListener('mouseover');
// })
},
mounted() {
this.$post('lxyl/cxfx/kw/query', {
......@@ -176,8 +176,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -222,8 +222,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -267,8 +267,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -312,8 +312,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -358,8 +358,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -404,8 +404,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -450,8 +450,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......@@ -496,8 +496,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
......@@ -64,8 +64,8 @@
`
$(infoBox).empty()
$(infoBox).append(content)
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 25) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 25) + 'px'); // 信息框距离左侧10像素
infoBox.style.top = event.clientY>400?((event.layerY - 125) + 'px'):((event.layerY + 40) + 'px'); // 信息框距离顶部10像素
infoBox.style.left =event.clientX>800?((event.layerX - 125) + 'px'):((event.layerX + 40) + 'px'); // 信息框距离左侧10像素
infoBox.style.display = 'block';
});
element.addEventListener('mouseout', function(event) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment