tooltip из Iframe
 

Есть код, который работает как всплывающая подсказка при наведение на картинку:

$(function() {
$(".picture").tooltip({ 
    delay: 0, 
    showURL: false, 
    bodyHandler: function() { 
    return $("<img/>").attr("src", this.src); 
    } 
});
});

Возникла необходимость сделать, чтобы эта подсказка появлялась не в iframe а в странице куда загружается Iframe. Пишу в загрузочную страницу код, но не знаю как правильно.

$(function() {
$('#iframe').contents().find('.picture').html();
var loader=document.getElementByTagName('BODY');
loader.innerHTML= $(".picture").tooltip({ 
    delay: 0, 
    showURL: false, 
    bodyHandler: function() { 
    return $("<img/>").attr("src", this.src); 
    } 
});
});

Blizzart,
1. Адрес фрейма и страницы с одного хоста ?

Deff, здравствуйте!
Да забыл написать, что проблем с безопасностью нет, так как с одного хоста.

Собственно вопрос - координаты подсказки - Важны ?
Если да - то опишите - как их выставлять

Вообще по центру экрана хотел выравнивать, хотя это не столь важно.

Blizzart,
Размещаете нужного размера div на основной странице, центрируете - скрываете display:none; -cюда будем закидывать подсказку из фрейма

<div id=tooltipStorag style="display:none"></div>

При возникновении/обработке подсказки
Придаете id данной подсказке (к примеру "IDtooltip"
и далее

$("#IDtooltip").appendTo("#tooltipStorag",parent.document.body)
$("#tooltipStorag",parent.document.body).show()

Я решил проверить пока в iframe
Ничего не придумал лучше наведения курсора для а вот как задать id подсказке, я не понял =(

$(function() {
$(".picture").tooltip({ 
    delay: 0, 
    showURL: false, 
	top: 500,
    bodyHandler: function() { 
    return $("<img />").attr("src", this.src);
	   } 
	});
	$(".picture").mouseover(function() {
	$("#IDtooltip").appendTo("#tooltipStorag");
    $("#tooltipStorag").show();
	});
});

$(".picture").attr("id","IDtooltip")

Хотя он Вам тут и не нужен

$(".picture").mouseover(function() {
  $(this).clone().appendTo("#tooltipStorag");
  $("#tooltipStorag").show();
 });

$(function() {
$(".picture").tooltip({ 
    delay: 0, 
    showURL: false, 
	top: 500,
    bodyHandler: function() { 
    return $("<img />").attr("src", this.src);
	   } 
	});
	$(".picture").mouseover(function() {
	$("#tooltip").appendTo("#tooltipStorag", parent.document.body);
    $("#tooltipStorag", parent.document.body).show();
	});
});

вот так работает как надо только в самом фрейме! div#tooltip оказывается создается автоматически. но на загрузочной странице срабатывает только "show();", а подсказка не помещается, даже так

$('#i_iframe').contents().find('#tooltip').appendTo("#tooltipStorag", parent.document.body);

Blizzart,
Есть тестовая Инет страничка ?

http://188.134.88.186/dictinory.html#i?3
вот, например :)
div#tooltipStorag в div#content
скрипт в каждом iframe - dictinory.js

Blizzart,
Повяз в фреймах

Можешь текущий скрипт поставить на нижний фрейм ? ( не файлом -а скриптом на страницу ) - тяжко елозить по загрузочным файлам (при удаче -потом всунешь обратно

Ксать я не понял - у тьву .tooltip в самом фрейме не всплывает ? ( Если открыть сам отдельный фрейм ? и елозить по нему

хорошо! в букве "Э" скрипт
открыл отдельно всё работает

Blizzart,
А там подсказа всплывает - чот я не обнаруживаю в самом фрейме - не

Ксать это что ?

1. Добейстесь нормального всплытия подсказки в одном отдельном фрейме...
Далее я поправлю

В том-то и проблема что она криво всплывает во фрейме... но если грузить в div#tooltipStorag, то нормально можно расположить

Blizzart,
Нун добиться нормально всплытия (без центрирования и наших добавлений) на самой страницы фрейма - далее мну доковыряет

(Но думаю уже к завтра - чот устал

сделал. хорошо, тогда до завтра :thanks:

Оказалось можно сделать проще. На родительскую страницу надо написать

$("#[a-z]_iframe").load(function () {
    var childElements = $(this).contents().find("#tooltip");
    $("#tooltipStorag").append(childElements);
});

а в фрейме можно ничего не добавлять, так как tooltip и так появляется и исчезает.
Только я не понял как правильно поместить регулярное выражение перед названием iframe, чтобы не добавлять класс. сейчас не подставляет любую букву

Blizzart,

$("#[a-z][a-z]_iframe").load(function () {
    var childElements = $(this).contents().find("#tooltip");
    $("#tooltipStorag").append(childElements);
});

Или

$("iframe[id$='_iframe']").load(function () {
    var childElements = $(this).contents().find("#tooltip");
    $("#tooltipStorag").append(childElements);
});

Deff,
Спасибо! сработал только второй вариант.
Жаль, мне не удалось выравнить тултип по центру экрана...

Центрировал!:dance: Поставил в плагине тултип left и top 0
и добавил такой скрипт на страницу:

function getClientWidth()  
{  
    return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth;  
}  
  
function getClientHeight()  
{  
    return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientHeight:document.body.clientHeight;  
            }  
              
jQuery.fn.center = function()   
    {  
    var w = $(window);  
    this.css("position","absolute");  
    this.css("top",(getClientHeight()-this.height())/2 + "px");  
    this.css("left",(getClientWidth()-this.width())/2 + "px");  
    return this;  
    } 

	$("#tooltip").center();