2016-09-27 1 views
5

У меня есть tooltop в моей карте местности, что я сделал, который я использую http://qtip2.com/Изменения положения подсказки/стрелок

мой код, когда я называю подсказка тем же один в этом вопросе Tooltip on map area tag

jQuery(document).ready(function (e) { 
jQuery('area').qtip({ 
    style: { 
     classes: 'qtip-dark' 
    }, 
    events: { 
     show: function(event, api) { 
      api.set({ 
       'content.text': api.elements.target.attr('title') 
      }); 
     } 
    } 
}); 
}); 

Но моя подсказка всегда находится в правом нижнем углу моей области, есть ли способ, которым я могу позволить это на верхнем правом углу вместо этого?

+0

попробовать это, 'мой: "нижний правый",' по адресу: вверху right', 'регулировки: нет none', Вы также можете проверить его на этой демонстрационной странице: [Нажмите здесь] (HTTP://qtip2.com/demos) –

+0

Вы можете создавать условия в соответствии с 'event.pageX' и 'event.pageY' –

+0

@chiragpatel, где я могу вставить эти свойства? – MattDAVM

ответ

0

Благодаря комментарию Chiral Patel я нашел способ, спасибо!

jQuery(document).ready(function (e) 
        { 
         jQuery('area').qtip({ 
          style: 
          { 
           classes: 'qtip-default qtip qtip-light qtip-rounded', 
           width: '250px', 
           height: '70px', 

          }, 
          position: 
          { 
           my : 'bottom left', 
           at: 'top right', 
           method:'none' 
          }, 
          events: 
          { 
           show: function(event, api) 
           { 

           api.set 
           ({ 
            'content.text': api.elements.target.attr('title') 
           }); 

           } 
          } 
          }); 
        }); 
1

Найти ответ ниже ответ будет полезным для вас.

jQuery(document).ready(function (e) 
        { 
         jQuery('area').qtip({ 
          style: 
          { 
           classes: 'qtip-default qtip qtip-light qtip-rounded', 
           width: '250px', 
           height: '70px', 
           tip: true 

          }, 
          position: 
          { 
           my : 'bottom left', 
           at: 'top right', 
           adjust: { 
            method: 'none none', // Requires Viewport plugin 
            resize: true 
           }, 
          }, 
          events: 
          { 
           show: function(event, api) 
           { 

           api.set 
           ({ 
            'content.text': api.elements.target.attr('title') 
           }); 

           } 
          } 
          }); 
        });