qTip2 внутри фрейма - PullRequest
Новая
       2

qTip2 внутри фрейма

1 голос
/ 26 августа 2011

Я использую jQuery qTip2 внутри iframe, но так как я ограничен размером и шириной iframe, есть ли у меня возможность отображать содержимое поверх iframe, т.е. внутри родительского окна iframe? а не в самом самом iframe?

Таким образом, я не ограничен размером iframe.

Это текущий код, который я использую как часть iframe: 

$(document).ready(function() {
   $('img[title]').qtip({
         content: {
            text: false, // Use each elements title attribute
            title: {
              text: 'Error',
              button: 'Close'
            }
         },
         hide: {
           event: false
         },
         style: {
            classes: 'ui-tooltip-dark ui-tooltip-rounded',
            height: 5,
            width: 500
         },
         position: {
            my: 'bottom right',
            at: 'top left'
         }
   });
});

Ответы [ 2 ]

3 голосов
/ 13 сентября 2011

Крейг опубликовал ссылку в ответ на ваш же пост на форумах qTip2 , который отвечает на ваш вопрос:

http://craigsworks.com/projects/forums/thread-solved-qtip-in-iframe-and-mouse-tracking

После прочтения обсуждения короткаяОтвет заключается в том, что вам придется инициализировать qTips из родительского документа, что упрощает jQuery.Сложность в том, что вам придется иметь дело с той же политикой происхождения в Javascript.Другими словами, оба документа должны быть из одного домена.Если нет, вам не повезло.

Еще одно предостережение: вам придется вручную корректировать позиционирование qTip, поскольку вы инициализируете из родительского документа.

Вот рабочийпример:

http://fiddle.jshell.net/4QDcz/1/

$(document).ready(function () {

    $('#theFrame').contents().find('.selector').qtip({
        position: {
            adjust: {
                x: $('#theFrame').offset().left,
                y: $('#theFrame').offset().top
            }
        }
     });

});
0 голосов
/ 26 августа 2011

Мне интересно, решит ли установка порта просмотра вашу проблему. как то так: 

position: {
             my: 'top center',  // Position my top left...
             at: 'bottom center', // at the bottom right of...
             viewport: $(window)
          },
...