2014-09-18 2 views
1

블로그 테마를 디자인 중입니다. 저자가 풍선을 쓴 이름에 풍선을 올렸을 때 풍선이 나타나고 이름이나 풍선을 남기면 풍선이 사라질 때 페이스 북 풍선과 유사한 저자 이름을 사용자가 맴돌 때 나타날 정보 풍선을 만들려고합니다. 나는 사용자가 풍선에있을 때 그되지 않을 것을 원하기 때문에 좀 jQuery를 시도했지만 항상 한 문제 한
사용자가 객체를 가리킬 때 풍선을 표시

이 dl.dropboxusercontent.com/u/28793409/baloon.jpg 같은


숨겨진. 난 내 jQuery 코드는 재해 알고 : D

$(function() {   
var authorInfo = $('.author-info'); 

$('.author').hover(function() { 
    $(this).find('.author-info').delay(700).fadeIn(); 
}); 


$('.author-info').mouseleave(function(){ 
    authorInfo.fadeOut(); 
}); 

$('.close').hover(function(){ 
    authorInfo.fadeOut(); 
}); 

$('.close').hover(function(){ 
    authorInfo.fadeOut(); 
}); 

$('#sereen').hover(function(e){ 
    e.stopPropagation(); 
}); 

authorInfo.hover(function(e){ 
e.stopPropagation(); 
}); 

}); 


를이 내가 https://dl.dropboxusercontent.com/u/28793409/Capture.JPG

설계 풍선 자사의 http://bit.ly/1uKDY3V 이 게시물에 작성자 이름에 마우스를 올려 주시기 바랍니다 페이지입니다. 나는 HTML과 CSS 부분을 만들었지 만 Jquery와 JS가 좋지 않아서 만들도록 도와주세요.

+0

나는 이해할 수 없다. 당신의 문제는 정확히 무엇입니까? – emha

+0

툴팁을 만들려고하십니까? JQuery에서 툴팁을 수행하는 자습서가 많이 있습니다. – ControlAltDel

+0

예 툴팁을 만들려고합니다. 하지만 내 툴팁은 조금 다르다 –

답변

0

안녕하세요 당신은 무료로 충돌 감지 기능을 제공하는 테더 드롭 플러그인을 확인할 수 있으며 이미지와 비슷하게 보이는 예가 있습니다.

http://github.hubspot.com/drop/docs/welcome/