gpt4 book ai didi

html - 导轨 : image change position after being updated

转载 作者:太空宇宙 更新时间:2023-11-03 17:38:32 25 4
gpt4 key购买 nike

我正在为 friend 建立一个摄影网站,她希望能够上传、编辑和删除图像。在本地主机上一切正常,但我注意到当我编辑图像时,它会改变位置并成为最后一个。有谁知道为什么会这样,或者可以告诉我如何从图像创建之日起对图像进行排序?

index.html.erb:

<section class='container'>
<article id='gallery'>
<% PreviewPicture.all.each do |preview_picture| %>
<a class="fancybox" rel="group" href="<%= preview_picture.picture.image.url(:original)%>" ><%= image_tag preview_picture.image.url(:original), :class => 'grayscale' %></a>
<% if user_signed_in? %>
<%= link_to "Delete #{preview_picture.id}", preview_picture_path(:id => preview_picture.id), method: :delete %>
<%= link_to "Edit #{preview_picture.id}", edit_preview_picture_path(:id => preview_picture.id) %>
<% end %>
<% end %>
</article>
</section>

<% if user_signed_in? %>
<%= link_to "Add Picture", new_preview_picture_path, :class => "add_preview_picture" %>
<% end %>

画廊.css:

section.container {
margin-top: 100px;
text-align: center;
width: 69%;
}

img.grayscale{
margin: 1.5px 0px;
filter: grayscale(100%);
-webkit-filter: grayscale(100%); /* For Webkit browsers */
filter: gray; /* For IE 6 - 9 */
}

img.grayscale:hover{
filter: grayscale(0%);
-webkit-filter: grayscale(0%);
filter: none;
}

最佳答案

您需要在 PreviewPicture 模型上创建一个范围或类方法,以按创建或更新日期对图片进行排序。

class PreviewPicture < ActiveRecord::Base
def self.by_date
order(created_at: :desc) // or order(updated_at: :desc)
end
end

然后你可以像这样使用它:

PreviewPicture.by_date.each

最好在 Controller 中设置它,因此在您的 View 对应的 PreviewPictureController 操作中:

@preview_pictures = PreviewPicture.by_date

然后在您的 View 中遍历 @preview_pictures 实例变量。

关于html - 导轨 : image change position after being updated,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29458379/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com