0

各ユーザープロファイル（localhost：3000 / users / username）には、ユーザーが行った投稿のリストがあります。クリックすると画像を表示するjQueryベースのライトボックスであるfaceboxを実装しました。これは私がそのために使用しているコードです：

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

問題は、ユーザーが5つの投稿を行った場合、フェイスボックスに表示するためにクリックすると同じ画像が5回繰り返されることです。

これは、@postsでレンダリングするshow.html.erbです。

<% 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>

これが_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>
4

3 に答える 3

0

すべてが同じ「rel」属性を持っているため、faceboxは画像を自動的にグループ化すると思います。

次のようなことを試してください：

<%= link_to post.image_url, :rel => "facebox-#{post.id}" do %>
  <%= image_tag post.image_url(:thumb).to_s %>
<% end %>
于 2013-03-13T19:54:11.440 に答える
0

それでもうまくいかない場合は、rel 属性を削除して、クラス名に基づいて facebox を呼び出してみてください。

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

そしてJavaScript：

$('a.facebox').facebox()
于 2013-03-13T22:41:03.710 に答える
0

の JavaScript_post.html.erbが含まれており、投稿ごとに 1 回実行されます。したがって、ユーザーが 5 つの投稿を持っている場合、facebox を 5 回初期化することになります。スクリプト タグをパーシャルの外に移動します。代わりに、show.html.erbページ全体で一度だけ実行されるように配置してください。

于 2013-03-13T20:17:12.823 に答える