Плагин jQuery PhotoPile не работает, но так просто, что-то я не так делаю?
Плагин, который я пытаюсь сделать: http://photopile-js.com/ вы можете видеть, что он буквально имеет как.... 3 строки инструкций, которые я вставил ниже. но почему-то вместо кучи фотографий, я получаю вывод в файл изображения. Другими словами, похоже, что CSS работает, но JS никогда не вызываетсяИсправления, которые я пробовал, но это не сработало:
- Вместо того, чтобы использовать предлагаемые ссылки на пользовательский интерфейс jQuery и jQuery с photopile-js.com, я перешел на jQuery и попытался использовать последние исходные URL-адреса (это код, который НЕ комментируется Закомментированный код является исходными URL-адресами, рекомендованными для photopile-JS)
- я попытался добавить скрипт на страницу, чтобы при загрузке окна вызывалась функция, и я получил функцию из файла photopile.js - я пытался потребовать photopile.js
до application.js
в javascript include tag
файла макета приложения
Код инструкции к фотопайлу
<body>
...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.js"></script>
<script src="YOUR/PATH/TO/photopile.js"></script>
</body>
<div class="photopile-wrapper">
<ul class="photopile">
<li>
<a href="PATH/TO/YOUR/FULLSIZE/IMAGE">
<img src="PATH/TO/YOUR/THUMBNAIL/IMAGE" alt="Image description" ... />
</a>
</li>
<!-- Add as many list items as you require for your gallery :) -->
</ul>
</div>
Посмотреть код:
<div class="photopile-wrapper">
<ul class="photopile">
<li><%= link_to "#{image_tag('Photo A.png')}".html_safe, "javascript:;" %></li>
<li><%= link_to "#{image_tag('Photo B.png')}".html_safe, "javascript:;" %></li>
<li><%= link_to "#{image_tag('Photo C.png')}".html_safe, "javascript:;" %></li>
<li><%= link_to "#{image_tag('Photo E.jpg')}".html_safe, "javascript:;" %></li>
<!-- Add as many list items as you require for your gallery :) -->
</ul>
</div>
<%= javascript_include_tag "photopile", "http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.js", "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" %>
<%= stylesheet_link_tag "photopile" %>
<script> <!-- I added this, didn't work -->
window.onload = function init() {
};
</script>
3 ответа
Я не могу объяснить, почему это так... но я много пробовал, и это имело значение:
Вместо использования javascript_include_tag
для файлов JQuery, я буквально должен был использовать script src
, И это буквально сделало это.
Похоже, у вас есть все фотографии в одном теге
Что-то вроде этого?
<li>
<%= link_to "#{image_tag('Photo A.png')}".html_safe, "javascript:;" %>
</li>
<li>
<%= link_to "#{image_tag('Photo B.png')}".html_safe, "javascript:;" %>
</li>
Где вы загружаете свой Javascript?
Попробуйте выполнить загрузку после разметки, связанной с вашей фотолабораторией, или, как минимум, загрузите photopile.js после.