search

wanmen / cats-rails

A Rails Implementation of Wanmen CATS
0 stars 0 forks source link

Fixed the Height of Book Cover #100

Closed photino closed 11 years ago

photino commented 11 years ago
  1. Fixed the height of book cover
  2. Fixed other minor bugs
Lincolnnus commented 11 years ago

@photino 现在是按照第一个图片的长宽比改其他所有的封面是么？这样感觉会refresh一下，不是很elegant。单纯用css可以做得好么？比如固定长宽？

photino commented 11 years ago

@Lincolnnus 确实，我也感觉这样refresh一下效果不好 我改用CSS试试，主要是流动布局不能事先知道宽度 或许可以用百分比 或者用CSS的clip属性

xtao commented 11 years ago

@photino 我的理解是，是用固定宽度或者百分比，然后用media定义不通的设备匹配。就是responsive，你可以搜一下bootstrap reponsive学习一下~

Lincolnnus commented 11 years ago

我个人觉得不要被流动布局给局限住了，其实完全可以fix width and height，因为当屏幕小的时候每行内容少了，保持原来的width和height看着依然很舒服的

@Lincolnnus https://github.com/Lincolnnus 确实，我也感觉这样refresh一下效果不好 我改用CSS试试，主要是流动布局不能事先知道宽度 或许可以用百分比 或者用CSS的clip属性

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28859239 .

xtao commented 11 years ago

@Lincolnnus 这就是responsive啊...

photino commented 11 years ago

@Lincolnnus 如果固定width和height，还不如在服务器端就固定呢 流动性布局的作用就是能够充分利用空间，不致于产生多余的空白

Lincolnnus commented 11 years ago

服务器端是把原图传上去，然后加个！medium，或者！big，！small啥的就得到一个固定尺寸的图，现在是固定width，也可以width height都固定如果需要的话 On Nov 20, 2013 6:40 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus 如果固定width和height，还不如在服务器端就固定呢 流动性布局的作用就是能够充分利用空间，不致于产生多余的空白

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28877643 .

Lincolnnus commented 11 years ago

@panzan 需要怎样比较合适呢？ On Nov 20, 2013 6:50 PM, "Shaohuan Li" shaohuan.li@gmail.com wrote:

服务器端是把原图传上去，然后加个！medium，或者！big，！small啥的就得到一个固定尺寸的图，现在是固定width，也可以width height都固定如果需要的话 On Nov 20, 2013 6:40 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus如果固定width和height，还不如在服务器端就固定呢 流动性布局的作用就是能够充分利用空间，不致于产生多余的空白

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28877643 .

photino commented 11 years ago

@Lincolnnus 我刚又试了一下，用CSS不好办，主要问题是：如果width是可变的，height固定，这样会导致图片变形，在不同的设备上有时会很难看 我觉得比较好的解决办法就是后端处理图片，把同一类型的图片都截成长宽比都一样的（如果做不到，那就width和height都固定好了）

photino commented 11 years ago

@Lincolnnus 其实后端只固定width不起什么作用，因为前端通过每个row放3个已经保证了每个图片的宽度都一样，然后如果长宽比再做到一致，那么高度自然也就一致了 所以保持图片的长宽比最关键 只要能让每个row放的图片长宽比都一样那就行了，比如所有book cover的比1:1.4，video cover的比为3:2

Lincolnnus commented 11 years ago

行。要不我加一个！book就返回一个固定width height的图，！video另一个，！list再一个。光比例的话图片有可能太大，还是固定长宽比较靠谱 On Nov 20, 2013 7:26 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus其实后端只固定width不起什么作用，因为前端通过每个row放3个已经保证了每个图片的宽度都一样，然后如果长宽比再做到一致，那么高度自然也就一致了 所以保持图片的长宽比最关键 只要能让每个row放的图片长宽比都一样那就行了，比如所有book cover的比1:1.4，video cover的比为3:2

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28880250 .

photino commented 11 years ago

@Lincolnnus 如果觉得太大，可以设置max-width来限制一下

Lincolnnus commented 11 years ago

太大主要是带宽太费了，和展示倒是没啥关系。省点钱哈 On Nov 20, 2013 7:32 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus 如果觉得太大，可以设置max-width来限制一下

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28880935 .

photino commented 11 years ago

@Lincolnnus 是啊，那就设小一点也无妨 封面图片模糊一点也没什么关系，能看出大概就行了吧

Lincolnnus commented 11 years ago

改了。你可以把之前的！medium改成！book如果是书的话，！video是视频，！list如果是list。搜索结果页面还是统一！medium好了，省点事 On Nov 20, 2013 7:36 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus 是啊，那就设小一点也无妨 封面图片模糊一点也没什么关系，能看出大概就行了吧

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28881852 .

photino commented 11 years ago

@Lincolnnus 你改后测试的页面不闪了吧

photino commented 11 years ago

@Lincolnnus 其实还有个问题 该放图片的地方不能没有图片啊 可以搞个默认图片啊

Lincolnnus commented 11 years ago

我等会儿看下，应该问题不大。你local如果还有什么要改的话就push上去吧。还有一个建议是在/books，/videos，小屏幕的时候最好一行有两本书，现在手机看popular books只有一本书感觉封面太大了点 On Nov 20, 2013 7:50 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus 你改后测试的页面不闪了吧

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28883480 .

Lincolnnus commented 11 years ago

什么地方没有图啊？书视频list都是必须有图的，不允许没图啊。只有用户profile有个默认图片 On Nov 20, 2013 7:52 PM, "Zan Pan" notifications@github.com wrote:

@Lincolnnus https://github.com/Lincolnnus 其实还有个问题 该放图片的地方不能没有图片啊 可以搞个默认图片啊

— Reply to this email directly or view it on GitHubhttps://github.com/wanmen/cats-rails/pull/100#issuecomment-28883630 .

photino commented 11 years ago

@Lincolnnus 好的 我这localhost有的地方没图，可能是数据库的原因吧

photino commented 11 years ago

@Lincolnnus 已经改小了 不过图片的medium之类的我没改 这个你来改吧

xtao commented 11 years ago

:beers: