JQuery Lightbox ж / CodeIgniter отсутствуют изображения

Question

Я пытаюсь внедрить плагин jQuery Lightbox в сайт портфолио, созданный на CodeIgniter. Я могу заставить лайтбокс загружаться и показываться при нажатии на изображение. Однако изображения, которые должны отображаться (например, close, next, prev и т. Д.), Не загружаются в световой блок.

<script src="<?php echo base_url(); ?>js/libs/jquery-1.6.2.js"></script>
<script src="<?php echo base_url(); ?>js/jquery.lightbox-0.5.min.js"></script>
<script type="text/javascript">
    $(function() {
      $('a.lightbox').lightBox(); // Select all links with lightbox class
    });
</script>

Я также пытался изменить путь к файлам изображений в файле .js, но он возвращает неработающие ссылки. Есть ли какой-то URL-помощник, который указывает Javascript в правильном направлении, или я не в той папке? Я пробовал root, папку js (ту же папку, что и скрипт) и папку views.

Answer 1

проблема в том, что пути к изображениям кнопок повреждены. Решением является редактирование файла ядра lightbox.js и исправление изображения. исправить свойство background-image для классов (lb-next, lb-prev, lb-close, lb-load). в моем случае я очистил один ../

Answer 2

Ну, похоже, вы правильно строите свой URL.Согласно вашему коду, папка JS находится на том же уровне, что и папка приложения.Убедитесь, что это правильный путь для вас!

• ПРИМЕНЕНИЕ (<?php echo base_url();?>application/)
• СИСТЕМА
• JS (<?php echo base_url();?>js/);
• index.php

Возможно, вы также захотите проверить, не препятствует ли .htaccess доступ к этой папке (IIRC-пакет поставляется с правилом «Запретить от всех» .htaccess, но внутри папки приложения).Если у вас есть пользовательский, модифицированный .htaccess, который может мешать отображению изображений).

И, как отметил Стив Льюис, отметьте в Firebug или в инструментах разработки IE или Chrome (обычно F12на клавиатуре), если на вкладке NET, или что-то аналог, показывает 404 для ресурсов.Вы пытались просмотреть исходный код и щелкнуть ссылки скрипта?Вы пытались получить доступ к изображениям прямо в браузере?

Answer 3

Та же проблема здесь, нашел решение на этом форуме: http://forums.modx.com/index.php?topic=44367.0

Изменение файла CSS ничего не сделало, однако я заметил, что «закрыть» GIF, который я пропустил, не был указан в складе lightbox.css файл тоже. Это заставило меня взглянуть на lightbox_lang_en.js, где я обнаружил, что пути к изображениям не имеют ведущих косых черт , заставляя браузер искать их не в том месте. Я добавил ведущий косые черты, и это начало работать. Вот мой модифицированный lightbox_lang_en.js:

Answer 4

Самый простой способ - запустить Firebug и найти на вкладке «Сеть» изображения, которые не были найдены, а затем исправить пути, либо переместив туда файлы, либо изменив пути в коде.

Я предполагаю, что у вас есть включенный CSS-файл лайтбокса (я не вижу его в вашем коде выше)

Вы также можете указать расположение для требуемых изображений при вызове лайтбокса следующим образом:

<script type="text/javascript">
    $(function() {
      $('a.lightbox').lightBox({
         'imageLoading': "<?php echo site_url(); ?>images/lightbox-ico-loading.gif",
         'imageBtnClose': "<?php echo site_url(); ?>images/lightbox-btn-close.gif",
         'imageBtnPrev': "<?php echo site_url(); ?>images/lightbox-btn-prev.gif",
         'imageBtnNext': "<?php echo site_url(); ?>images/lightbox-btn-next.gif",
         'imageBlank': "<?php echo site_url(); ?>images/lightbox-blank.gif"
      }); // Select all links with lightbox class
    });
</script>

переменные для этого перечислены здесь .