Facebox jQuery не работает с динамическими дисками Ajaxtabs - PullRequest
Новая
       23

Facebox jQuery не работает с динамическими дисками Ajaxtabs

0 голосов
/ 21 марта 2012

Эта проблема беспокоит меня уже несколько дней и может действительно помочь с вашим вводом ...

Я использую http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/ajaxtabs_suppliment3.htm для создания вкладок ajax для моего сайта, а также http://defunkt.io/facebox/ для модальных окон. Но когда я пытаюсь загрузить ссылки через Facebox через вкладки ajax, содержимое не загружается в Facebox. Но он отлично работает для любых ссылок вне вкладок ajax (то есть, которые загружаются с PHP прямо на месте, когда сайт загружается).

Есть идеи? Пожалуйста, помогите в этом, чтобы завершить мой сайт ...

Спасибо всем заранее

George

Ниже приведен код jquery для моего фейсбокса: 

enter code here

<script>
jQuery(document).ready(function($) {
$('.embed-thumbnail').click(function(event) {
event.preventDefault();
$.facebox($(this).parent().find('.embed-content')[0].innerHTML)
});
$.facebox.settings.loadingImage = '../static/img/loading.gif'
$.facebox.settings.closeImage = '../static/img/closelabel.png'
$.facebox.settings.opacity = 1
$.facebox.settings.faceboxHtml = '\
<div id="facebox" style="display:none;"> \
<div class="popup"> \
<div class="content"> \
</div> \
<a href="#" class="close"><img src="../static/img/closelabel.png" title="close"    class="close_image" /></a> \
</div> \
</div>'
});
</script>

Код Ajaxtab: 

<script type="text/javascript">
var countries=new ddajaxtabs("popularPosts", "populardivcontainer")
countries.setpersist(true)
countries.setselectedClassTarget("linkparent") //"link" or "linkparent"
countries.init()
</script>

1 Ответ

0 голосов
/ 21 марта 2012

ОК, похоже, вам нужно будет заново привязать Facebox после загрузки Ajax.

Так что с вкладками ajax используйте: 

instance.onajaxpageload=function(pageurl){
//custom code here
}

и:

Attach It onLoad

Хотя вызов facebox () для любого тега привязки сработает, проще дать вашим ссылкам Faceboxy rel = "facebox" и поразить их всех onLoad. 

jQuery(document).ready(function($) {
 $('a[rel*=facebox]').facebox() 
})

Таким образом, вы должны получить что-то вроде: 

instance.onajaxpageload=function(pageurl){
 $('a[rel*=facebox]').facebox() 
}

Очевидно, заменив «instance» вашим объектом tabs - это должно привязать вновь загруженные элементы Facebox к коду.

Единственное, что не ясно из документации, - это если .onajaxpageload метод завершит загрузку содержимого Ajax, так как это то, что вы хотите (не во время или до).

Редактировать:

Новый скрипт, который нужно попробовать. 

<script type="text/javascript"> 
  var countries=new ddajaxtabs("popularPosts", "populardivcontainer") 
  countries.setpersist(true) 
  countries.setselectedClassTarget("linkparent") //"link" or "linkparent" 
  countries.init() 

$(document).ready(function() { 
   loadFacebox();

   countries.onajaxload=function(pageurl) {
     loadFacebox();
   };
}); 

function loadFacebox() {
  $('.embed-thumbnail').click(function(event) { 
event.preventDefault(); 
$.facebox($(this).parent().find('.embed-content')[0].innerHTML) 
}); 
$.facebox.settings.loadingImage = '../static/img/loading.gif' 
$.facebox.settings.closeImage = '../static/img/closelabel.png' 
$.facebox.settings.opacity = 1 
$.facebox.settings.faceboxHtml = '\ 
<div id="facebox" style="display:none;"> \ 
<div class="popup"> \ 
<div class="content"> \ 
</div> \ 
<a href="#" class="close"><img src="../static/img/closelabel.png" title="close"    class="close_image" /></a> \ 
</div> \ 
</div>' 
};
</script>

Или что-то в этом роде ... Возможно, вам понадобится более хитрый способ определения местоположения элементов вашего фейсбокса - однако при этом должен быть связан тот же кодпосле каждой загрузки вкладки.

...