Incompatibilité entre taphold de jquery mobile et fancybox de jquery
C urgent :calim2: ,Bonjour tout le monde,svp j'ai un soucis concernant la compatibilité entre taphold de jquery mobile et fancybox de jquery:
je veux que si j'appui sur l'image d'une personne plus d'une 50 ms par exemple,il affiche les détaille de cette personne ,voilà le code
en HTML du premier page ou il y a l'image que je dois appui:
Code:
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
| <!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.css" />
<script src="http://code.jquery.com/mobile/1.2.1/jquery.mobile-1.2.1.min.js"></script>
<script src="resources/javascript/js.js"></script>
<script type="text/javascript" src="./resources/source/jquery.fancybox.js"></script>
<script type="text/javascript" src="./resources/source/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./resources/source/jquery.fancybox.css" media="screen"/>
<link rel="stylesheet" type="text/css" href="./resources/css/style2.css" media="screen"/>
</head>
<body>
<a class="fancy" data-fancybox-type="iframe" href="iframe.html"><img id="etudiant" src="./resources/images/Capture.PNG" /></a>
<br/>
<div id="Hicham" >
<h4>Hicham Chaouki</h4>
</div>
</body>
</html> |
la page qui sera affiché en fancyBox:
Code:
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
| <!DOCTYPE html>
<html>
<head>
<title>fancyBox - iframe demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="./resources/css/style1.css" media="screen"/>
</head>
<body>
<div id="left" style="width: 30%;">
<img id="etudiant" src="./resources/images/Capture.PNG" />
</div>
<div id="right" style="width: 70%;" >
<table>
<tbody>
<tr>
<th align=left>Nom:</th>
<td>
Hicham Chaouki
</td>
</tr>
<tr>
<th >
Date de Naissance:
</th>
<td>
25/07/1988
</td>
</tr>
<tr>
<th align=left>
Filière :
</th>
<td>
Maths-Info
</td>
<tr>
</tbody>
</table>
</div>
</body>
</html> |
en javascript:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| $(document).ready(function() {
$(".fancy").on("taphold","img",function(){
$(this).fancybox({
padding :[0,15,15,15,15],
maxWidth : 600,
maxHeight : 600,
fitToView : false,
width : '70%',
height : '50%',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
}); |
si je remplace alert au lieu de la méthode $(this).fancybox() ça marche tres bien,svp est ce que qqn peut m'aider,c urgent
