Довольно фото не сработает при использовании .load? - PullRequest
Новая
       8

Довольно фото не сработает при использовании .load?

1 голос
/ 12 февраля 2011

Привет всем,

Я пытаюсь загрузить элементы из #somediv на "странице B" в мой основной div #content в моем файле index.html.

Я попытался прочитать несколько сообщений на этом сайте, и я просто не могу понять, что я делаю неправильно. Я новичок в jquery, так что это, вероятно, объясняет мою неумелость!

В любом случае: использование ссылок Pretty Photo на моей главной странице работает нормально

У меня есть соответствующие ссылки на jQuery.js, prettyphoto.js & css и т. Д., И все работает хорошо.

На странице «B», которую я пытаюсь перенести в каталог index.html #content div с содержимым #somediv - у меня также есть соответствующие ссылки, и красивая фотография прекрасно работает и на этой странице. .

Моя проблема: я использую эту функцию (вызывается с моей страницы index.html и находится во внешнем файле, который я вызываю из раздела head моей страницы index.html, если это помогает) для загрузки содержимого внешней ( но на том же домене) страница. 

   $(document).ready(function() {
  $("#EVL_1").click(function(event){
   $('#content').load('INFO_du.html #EVL_1');
    $("a[rel^='prettyPhoto']").prettyPhoto(); 
  });
  $("#EVL_2").click(function(event){
    $('#content').load('INFO_du.html #EVL_2');
    $("a[rel^='prettyPhoto']").prettyPhoto(); 
  });  });

и нажав на ссылку, содержащуюся в "Page B" #somediv, которая загружается на мою страницу index.html через .load с помощью этого скрипта (см. Ниже) 

<span class="file"><a href="Dry_Utility/test.html?iframe=true&width=100%&height=100%" rel="prettyPhoto[test]" title="A very old Sample for illustrative purposes!">Test - regular HTML</a></span>

Работает нормально для правильной загрузки внешнего div, и на моем рабочем столе с использованием IE, когда я нажимаю на ссылку, появляется симпатичная фотография,

Но когда я загружаю его на свой сервер и пробую, ссылка на test.html выше не открывается на красивой фотографии - она ​​открывается в новом окне? (используя IE, Chrome и Firefox), поэтому я определенно что-то упускаю:

Прочитав все записи здесь, я понял, что должен каким-то образом вызвать JavaScript-код prettyphoto «Я думаю» после функции .load. Вот когда я добавил следующую строку после раздела .load, и это сработало на моем рабочем столе (но больше нигде!) 

        $("a[rel^='prettyPhoto']").prettyPhoto();

Я пробовал разные вещи, которые нашел на этом сайте весь день, и не могу понять, как заставить это работать, и загрузить prettyphoto.js после того, как я выполню .load и перенесу div на мою главную страницу.

извините, если это действительно глупо, я просто не понимаю?

Еще одна мысль: я использую .load, чтобы перенести #somediv, который содержит ссылку выше на третью страницу (также в том же домене) test.html (может, в этом моя проблема?)

Ответы [ 2 ]

1 голос
/ 12 февраля 2011

Я полагаю, у вас проблемы, потому что "нагрузка" не возвращается сразу же.Сделайте ваш звонок в prettyPhoto в успешном обратном вызове, и я думаю, что он будет работать!

Точнее говоря, в вашей локальной тестовой среде он возвращается мгновенно.Но на сервере это занимает немного больше времени, поэтому ваш HTML не отображается в документе, когда вы обращаетесь к элементам .prettyPhoto.Имеет смысл?

http://api.jquery.com/load/

$('#result').load('ajax/test.html', function() {
  alert('Load was performed.');
});
0 голосов
/ 14 февраля 2011

Спасибо за направление Доусон:

Теперь это работает - см. Ниже (просто нужно было убедиться, что у меня есть файл css в заголовке страницы test.html, и мы хороши!)

Использовал эту функцию: 

            $(document).ready(function() {   
            $("#EVL_1b").click(function(event){    
                $('#content').load('INFO_du.html #EVL_1b', function() {     
                $("a[rel^='prettyPhoto']").prettyPhoto();    
                });
            });
        });

и эту ссылку (чтобы избавиться от; верните ложь, которая звучала как плохая идея, когда я читал этот сайт) 

<a href="#" id="EVL_1b">EVL_1b</a>

Еще раз спасибо за вашу помощь !!!

...