요소의 왼쪽 가장자리에 jQuery 정렬하기

Question

저는 jQuery Tipsy Plugin을 사용하여 프로젝트에서 툴팁을 만듭니다. 툴팁은 플러그인 페이지 데모에서 볼 수 있듯이 자동으로 요소의 중앙에 배치되지만, 요소의 왼쪽에 맞춰 주길 원합니다.이를 수행하는 방법을 아는 사람이 있습니까? 플러그인은 표시 될 때 자동으로 툴팁의 절대 위치를 설정합니다.이 함수를 변경하려고했지만 행운이 없었습니다.

업데이트 1 : 나는 그것의는 해당 요소 년대 왼쪽 가장자리에 화살표 나 툴팁의 중심을 찾고, 워드 프로세서와 gravity 옵션을 잘 알고 있습니다.

업데이트 2 : 여기까지 나는 툴팁 배치하는 방법의 모의는 다음과 같습니다

Answer 1

해결책을 찾았는데 잘못된 기능을 편집하고있었습니다. 내가 넣다의 다른 필요성에게 힘내에이 기능을이 포크거야

  if (gravity.length == 2) { 
       if (gravity.charAt(1) == 'w') { 
        tp.left = pos.left - 5; 
       } else { 
        tp.left = pos.left + pos.width/2 - actualWidth + 15; 
       } 
      } 

: 그것은 차례 밖으로 특별히 JS 업데이트 'NW/SW'중력, 또 다른 기능이 있었다.

Answer 2

당신은 중력 옵션에 따라 위치를 설정 할 수 있어야한다 :

$('#foo').tipsy({gravity: 'e'}); // these are coordinates: // nw | n | ne | w | e | sw | s | se 

플러그인 옵션에 대한 정보는이 페이지에서 찾을 수 있습니다. 자세한 내용이나 기타 구성 옵션은 gravity라는 절을 참조하십시오. (라인 43) 소스를 들여다 보면

http://onehackoranother.com/projects/jquery/tipsy/#

Answer 3

, 나는이 찾을

,

case 'n': 
tp = {top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width/2 - actualWidth/2}; 

나는 left을 변경 추측하는 것은 트릭을해야한다.

Answer 4

답장을 보내 주신 @Ryan,이 답변을 보내 주시면 감사하겠습니다. 코드를 좀 더 살펴보고 더 많은 기능을 제공했습니다.

• sw/nw에 당신 edgeAlignEast: 'left' 또는 edgeAlignEast: 'center'
을 사용할 수 있습니다, 당신은 se/ ne에 edgeAlignWest: 'right' 또는 edgeAlignWest: 'center'
• 을 사용할 수 있습니다 : 그것은 다음과 같은 않도록

  나는 기운에 2 개의 새로운 옵션을 추가

새 코드는

입니다.

// line 61, tipsy version 1.0.0a 
if (gravity.length == 2) { 
    if (gravity.charAt(1) == 'e') { 
     tp.left = (this.options.edgeAlignEast == 'right') ? (pos.left + pos.width - actualWidth + 15) : (pos.left + pos.width/2 - actualWidth + 15); 
    }else if (gravity.charAt(1) == 'w') { 
     tp.left = (this.options.edgeAlignWest == 'left') ? (pos.left - 5) : (pos.left + pos.width/2 - 15); 
    } else { 
     tp.left = pos.left + pos.width/2 - actualWidth + 15; 
    } 
} 

//... 
// line 191, tipsy version 1.0.0a 
$.fn.tipsy.defaults = { 
    edgeAlignEast: 'center', // <-- new option, default to 'center', you can also use 'right' 
    edgeAlignWest: 'center', // <-- new option, default to 'center', you can also use 'left' 
    className: null, 
    delayIn: 0, 
    delayOut: 0, 
    fade: false, 
    fallback: '', 
    gravity: 'n', 
    html: false, 
    live: false, 
    offset: 0, 
    opacity: 0.8, 
    title: 'title', 
    trigger: 'hover' 
};