Rails 3 & FancyBox

Question

Я только начал пытаться изучать JS, поэтому извиняюсь, если это кажется глупым вопросом, но я немного растерялся.У меня есть набор изображений, которые я счищаю со своей страницы Flickr, я решил добавить лайтбокс, чтобы попытаться получить опыт работы с JS, поэтому я установил его со страницы GitHub и следовал инструкциямИнструкции по добавлению в application.js:

//= require jquery
//= require fancybox

И добавить в мой custom.css:

/*
 *= require_self
 *= require fancybox
 *= require_tree .
*/

У меня тогда есть:

<script type = "text/javascript">
$(document).ready(function() {

/* This is basic - uses default settings */

$("a.flickr_photo").fancybox({'type': 'image'});

 });
</script>

Вчастично, вызывая набор изображений, которые создаются:

<%= link_to(image_tag(p.url, :class => 'flickr_photo', :title => p.title, :border => 0), p.url_photopage) %>

Теперь я просто немного застрял, он ничего не делает, но и не выдает ошибку, поэтому любая помощь будетдействительно здорово!

Answer 1

Возможно, вы получили конфликт по идентификатору $ от Prototype (я предполагаю, что вы не избавились от стандартного кода RoR Prototype). Prototype - это библиотека Javascript, похожая на jQuery и поставляемая в комплекте с RoR. Проблема в том, что он также использует $, как и jQuery, так что в конечном итоге каждый $ будет опробован в качестве функции или переменной Prototype. Вот как я это исправил в своем приложении, в котором для некоторых изображений использовался ползунок jQuery:

• добавьте jQuery.noConflict(); в место, где он будет загружен перед другим кодом jQuery, но после фактического файла jquery.js. Посмотрите, какие из ваших файлов jQuery .js загружаются первыми, и поместите их в начало файла.
• Далее, каждый бит вашего кода jQuery должен быть изменен с использования $ на использование jQuery. Для этого используйте поиск / замену в своем любимом текстовом редакторе в ваших jQuery-файлах .js.
• Убедитесь, что весь будущий код jQuery использует jQuery вместо $ (то есть jQuery("#id_of_element").show(); вместо $("#id_of_element").show();)

Как вы, вероятно, можете понять, это меняет идентификатор jQuery с $ на jQuery, что избавляет от конфликта с Prototype. Если я правильно поставил диагноз, это должно исправить твою проблему!