Среда: - jquery 1.9.1 - qtip2: 2.0.1-35
Я столкнулся со странной проблемой при открытии qtip2, привязанного к правому клику (в качестве замены контекстного меню, после официальное руководство для этого).
В firefox все идет хорошо, и контекстное меню появляется, как только я щелкаю правой кнопкой мыши целевой элемент. В Chrome по неизвестной причине мне нужно щелкнуть левой кнопкой мыши, а затем щелкнуть правой кнопкой мыши цель, чтобы заставить работать qtip.
Странно то, что он правильно работает в обоих браузерах с этой скриптой: http://jsfiddle.net/PaQ7R/10/
с точно таким же исходным кодом.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsFiddle demo</title>
<script src="jquery/jquery-1.9.1.js"></script>
<script type='text/javascript' src="jquery/jquery.qtip.js"></script>
<link rel="stylesheet" type="text/css" href="css/jquery.qtip.css">
<style type='text/css'>
ul#candMenu {
display: none;
}
</style>
<script type='text/javascript'>
$(document).ready( function() {
$(document).on("mousedown", ".test", function(event) {
$(this).qtip({
content: {
text: $("#candMenu").clone()
},
show: {
event: "mouseup",
ready: true,
solo: true
},
hide: {
event: "unfocus" // Si qqchose d autre que le tooltip est cliqué
},
position: {
my: "left top",
target: "mouse", // Position it where the click was...
adjust: { mouse: false }, // ...but dont follow the mouse
viewport: $(window) // empêche le débordement de la fenêtre
},
events: {
show: function(eventShow, api) {
if(eventShow.originalEvent.which !== 3) {
eventShow.preventDefault();
}
}
}
}, event);
}).bind("contextmenu", function() { return false; });
});
</script>
</head>
<body>
<a href="javascript:;" class="test">Test right click</a><br />
<a href="javascript:;">No-test</a>
<table border="1" width="100%">
<tr class="test">
<td>prem</td>
<td>seco</td>
<td>third</td>
</tr>
<tr class="test">
<td>prem</td>
<td>seco</td>
<td>third</td>
</tr>
</table>
<UL id="candMenu">
<LI class="event separator"><A href="javascript:;">Événements<SPAN class="holdctrl"></SPAN></A></LI>
<LI class="edit"><A href="javascript:;">Infos du candidat<SPAN class="holdctrl"></SPAN></A></LI>
<LI class="permis"><A href="javascript:;">Demande de permis<SPAN class="holdctrl"></SPAN></A></LI>
<LI class="prod"><A href="javascript:;">Produits<SPAN class="holdctrl"></SPAN></A></LI>
<LI class="regle"><A href="javascript:;">Règlements<SPAN class="holdctrl"></SPAN></A></LI>
<LI class="form"><A href="javascript:;">Formation<SPAN class="holdctrl"></SPAN></A></LI>
</UL>
</body>
</html>
Я пробовал также в среде без SSL и такое же странное поведение. Я не могу найти, есть ли трюк в среде скрипки или неправильная конфигурация на моем сервере, чтобы объяснить эту разницу.
