2016-06-12 3 views
0

간단한 qtip2 데모를 실행하려고하는데 작동하는데 도움이 필요하지 않습니다. qtip2는 개별 툴팁을 생성 할 수있는 프레임 워크입니다. 링크 위로 마우스를 가져 가면 작은 노란색 상자가 나타납니다.간단한 qtip2 예제가 작동하지 않습니다.

모든 파일은 같은 폴더에 있습니다.

+0

콘솔에 오류가 있습니까? 소스가 제대로로드되지 않은 것 같아요 ... – Jurudocs

+0

로드되어 있는지 확인하는 방법은 무엇입니까? –

+0

브라우저에서 개발자 도구를 사용할 수 있습니다. 단지 Google뿐입니다. 또는 메뉴 내부를 살펴보면 ... 개발자 도구와 같은 것이 있어야합니다 ... 그러면 브라우저의 작은 창과 콘솔이라는 탭이 나타납니다. 여기를 클릭하면 절망적으로 오류가 표시됩니다 – Jurudocs

답변

1

<html> 
 
<head> 
 
<title>My site</title> 
 

 
<!-- CSS file --> 
 
<link type="text/css" rel="stylesheet" href="jquery.qtip.css" /> 
 

 
</head> 
 
<body> 
 

 

 
<script type="text/javascript" src="jquery.min.js"></script> 
 

 

 
<script type="text/javascript" src="jquery.qtip.js"></script> 
 

 

 
<script type="text/javascript" src="jquery.imagesloaded.pkg.min.js"></script> 
 

 

 
<a href="#test" title="My tooltip text">Sample link</a> 
 

 
<script> 
 
// self executing function here 
 
(function() { 
 

 
    // your page initialization code here 
 
    // the DOM will be available here 
 
$('a[title]').qtip(); 
 
})(); 
 
</script> 
 

 
<a href="#test" title="My tooltip text">Sample link</a> 
 
</body> 
 
</html>

내가는 imagesloaded 같은 unnessesary 코드를 제거하고 CDN 버전과 당신이 가지고있는 jQuery를 링크를 교체합니다.

그리고 작동합니다.

<html> 
<head> 
<title>My site</title> 
<!-- CSS file --> 
<link type="text/css" rel="stylesheet" href="jquery.qtip.css" /> 
</head> 

<body> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js">   </script> 
<script type="text/javascript" src="jquery.qtip.js"></script> 
<a href="#test" title="My tooltip text">Sample link</a> 
<script> 
// self executing function here 
(function() { $('a[title]').qtip(); })(); </script> 
<a href="#test" title="My tooltip text">Sample link</a> 
</body> 
</html> 
+0

haha ​​thaks for my cherries! ;-P – Jurudocs

+0

우리가 도울 수있어서 기쁩니다. –

관련 문제