2013-03-07 3 views
0

С fancybox (v2), как я могу создать уникальный URL-адрес, который при загрузке отображает fancybox с содержимым iframe. Я отлично работаю с встроенным контентом (например, www.mysite.com/index.html#idgoeshere), но не знаю, что должен содержать URL или js, чтобы загрузить fancybox и внутри него конкретный iframe или ajax.txt.jquery fancybox, iframe или ajax, загрузка с помощью url

То, что я пытаюсь достичь, путем идти к ссылке как:

www.mysite.com/index.html#iframe.html

Загрузите индексную страницу, с окном FancyBox открыт , а страница iframe.html загружается в окно fancybox (в качестве альтернативы это может быть файл .txt, загруженный через ajax).

HTML

<a class="fancybox fancybox.iframe" href="iframe.html">Iframe</a> 

FancyBox

<script> 
$(document).ready(function($) { 
    $.fancybox({ 
    content: $(window.location.hash).html() 
}); 
    $('.fancybox').fancybox(); 
}); 
</script> 

Спасибо за любую помощь или руководство.

Kyle

Update

Спасибо за помощь !! всякие Вот что закончилось тем, что отлично работает для меня. Я спас нам свое содержание в отдельные HTML файлы, а затем назвал их fancybox.iframe

JS:

<script> 
$(document).ready(function() { 
    $('.fancybox').fancybox({ 
    'scrolling' : 'no' 
    }); 
    if (window.location.hash !== "") { 
     $(window.location.hash).click(); 
    } 
}); 
</script> 
+0

Мне кажется, что вы хотите уменьшить время загрузки da –

+0

возможно дублировать [время загрузки jquery fancybox и уникальные URL-адреса] (http://stackoverflow.com/questions/15251905/jquery-fancybox-load-times-and-unique-urls) – JFK

+0

Не повторяйте тот же вопрос, отредактируйте старый, если вы хотите уточнить – JFK

ответ

0

Посмотрите примеры на the Fancybox site Действие Fancybox полностью основано на ссылке href. Итак, если вы загружаете страницу и затем обновляете ссылку href на странице, чтобы указать на iframe.html, прежде чем звонить .fancybox на нее, тогда она должна работать как ожидалось. Внимание: Непроверенный код с верхней частью моей головы, чтобы следовать ...

$(document).ready(function(){ 
    $('#target').attr('href', window.location.hash.substring(1)).fancybox(); 
}); 

Вызов подстроки необходимо удалить # из хэш строки вернулось из window.location.hash

Надеется, что это помогает

+0

Спасибо @ jxpk777, будет #target быть классом .fancybox? – Kyle

+0

Да, какой бы целевой элемент не использовался для замены этого содержимого, все, что вы намереваетесь в конечном итоге вызвать '.fancybox'. Я согласен с Джо, что использование хэша местоположения - отличная идея. Вероятно, что-то с строкой запроса является лучшим подходом. – jxpx777

1

Использование хэштегом это плохая идея, потому что такие сайты, как Google и Facebook, часто игнорируют их.

Вместо этого используйте функцию window.history.replacestate в функции afterLoad fancybox.

Например:

afterLoad:function(){ 
    window.history.replaceState({},"Fancybox","/url-to-set"); 
} 

Weird вещь о replaceState является то, что первые два аргумента не имеют значения (насколько я знаю). Единственное, что имеет значение, это окончательный аргумент «/ url-to-set». Вы хотите установить это как уникальный URL-адрес, который вы хотели бы иметь в качестве своего URL-адреса.

+0

спасибо Джо, но будет ли это появляться в fancybox с загрузкой контента каждый раз? Я ищу, чтобы иметь возможность всплывать только с помощью специального URL-адреса. Благодарю. – Kyle

Смежные вопросы