2013-03-13 9 views
0

각 사용자 프로필 (localhost : 3000/users/username)에는 사용자가 작성한 게시물 목록이 있습니다. 내가 클릭하면 이미지를 표시하는 jQuery 기반 라이트 박스 인 facebox를 구현했습니다.각 게시물을 개별화하는 방법은 무엇입니까? (Ruby on Rails)

<a href=<%= post.image_url %> rel="facebox"><%= image_tag post.image_url(:thumb).to_s %></a> 

문제는 사용자가 5 개 게시물을 만든 경우 facebox에 표시 클릭했을 때, 동일한 이미지가 5 번 반복한다는 것입니다 : 이것은 내가 그것을 위해 사용하고 코드입니다.

이 내가 @posts

<% provide(:title, @user.name) %> 
<div class="row"> 
    <aside class="span4"> 
    <section> 
     <h1> 
     <%= gravatar_for @user %> 
     <%= @user.name %> 
     </h1> 
    </section> 
     <br> 
    </aside> 
<br> 


    <div class="span10"> 
    <%= render 'follow_form' if signed_in? %> 
    <% if @user.posts.empty? %> 
<h3>Browse</h3> 
<% end %> 
    <% if @user.posts.any? %> 
     <ol class="posts"> 
     <%= render @posts %> 

     </ol> 

     <%= will_paginate @posts %> 
    <% end %> 
    </div> 
</div> 

을에 렌더링 내 show.html.erb이며, 여기에 _post.html.erb

<script src="/jquery.js" type="text/javascript"></script> 
<link href="/src/facebox.css" media="screen" rel="stylesheet" type="text/css"/> 
<script src="/src/facebox.js" type="text/javascript"></script> 
<script language="javascript"> 

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

</script> 


    <li> 
     <span class="content"><%= simple_format(post.content) %></span> 
     <% if post.image.present? %> 
     <a href=<%= post.image_url %> rel="facebox"><%= image_tag post.image_url(:thumb).to_s %></a> 
     <br> 
     <% else %> 
     <% end %> 
     <span class="timestamp"> 
     Posted <%= time_ago_in_words(post.created_at) %> ago. 
     </span> 
</li> 
+2

오류가 무엇입니까? –

+0

오류는 없지만 이미지를 클릭하여 팝업 상자 (facebox 스크립트)에 표시하면 사용자가 가지고있는 게시물의 수와 상관 관계가있는 동일한 이미지가 반복됩니다. 따라서 사용자가 11 개의 게시물을 가지고있는 경우, 클릭 한 이미지는 한 번의 팝업에서 11 번 반복됩니다. – user2159586

+0

facebox를 초기화하는 자바 스크립트 코드를 게시 할 수 있습니까? 이 예제를 재현하기 위해 샘플 프로젝트를 만들려고했으나 재현 할 수 없었습니다. 아마도 이것을 증명하는 jsFiddle도 도움이 될 것입니다. –

답변

0

_post.html.erb에서 자바 스크립트가 포함되어 있으며 각 게시물에 대해 한 번 실행됩니다. 따라서 사용자가 다섯 개의 게시물을 가지고 있다면 facebox를 다섯 번 초기화합니다. 부분에서 스크립트 태그를 이동하십시오. 대신 전체 페이지에 대해 한 번만 실행되도록 show.html.erb에 입력하십시오.

+0

감사합니다. 도움에 감사드립니다. – user2159586

0

내가 있기 때문에 자동으로 facebox 그룹 이미지를 생각을이다 모두 같은 "rel"속성을가집니다. 이 같은

시도 뭔가 :

<%= link_to post.image_url, :rel => "facebox-#{post.id}" do %> 
    <%= image_tag post.image_url(:thumb).to_s %> 
<% end %> 
+0

불행히도 같은 문제가 발생합니다. 더 설명하기 위해, localhost에 2 개의 다른 이미지 게시가있는 경우 : 3000/users/username 그리고 그 중 하나를 클릭하면 동일한 이미지가 반복됩니다. 표시되는 이미지는 정확하지만 사용자가 보유한 게시물 수에 따라 반복됩니다. – user2159586

+0

생성 된 HTML 소스를 조사하십시오. 내가 facebox를 잘 알지는 못했지만, 이것은 정말 똑같은 rel-attribute를 가진 "다른"이미지들 (모든 이미지들)을 한 번에 그룹화하려고 시도하는 것처럼 들립니다. – jack

0

여전히 운이없는 경우, 클래스 이름을 기반으로 facebox를 rel 속성을 제거하고 전화를 시도 :

<%= link_to post.image_url, :class => "facebox" do %> 
    <%= image_tag post.image_url(:thumb).to_s %> 
<% end %> 

그리고 자바 스크립트 :

$('a.facebox').facebox()