2
필자는 요소에 지정된 데이터 속성을 기반으로 툴팁을 표시하려고 노력하면서 절대 위치에 이미지를 배치했습니다. 어떤 이유로 툴팁의 위치는 항상 꺼져 있습니다. 데모를 포함 시켰습니다. 누구든지 문제를 파악할 수 있습니까? 절대 위치 요소 위로 툴팁을 올바르게 배치하는 방법은 무엇입니까?
$("div.thing").each(function (i) {
var objthis = this;
$(this).qtip({
show: 'click',
hide: 'click',
content: {
text: 'hey'
},
position: {
corner: {
tooltip: 'topLeft',
target: 'topLeft'
},
adjust: {
x: $(objthis).data('left'),
y: $(objthis).data('top')
}
}
});
});
div#container {
position: relative;
width: 100px;
height: 100px;
background-color: black;
}
div.thing {
position: absolute;
z-index: 1;
border: 0;
height: 10px;
width: 10px;
top: 50px;
left: 20px;
background-color: red;
}
<link href="http://cdn.jsdelivr.net/qtip2/2.2.1/jquery.qtip.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/qtip2/2.2.1/jquery.qtip.min.js"></script>
<div id="container">
<div class="thing" data-top="50" data-left="20"></div>
</div>
offset
을 설정하여
몰라,하지만 난 당신의 툴팁 위치 (대신 50-20의 100-40)를 두 배로 생각 (어쩌면 당신은 데이터 상단과 데이터를 제거해야합니다 - HTML에서 왼쪽?) – Hotted24