这是一个创建于 3787 天前的主题，其中的信息可能已经有所发展或是发生改变。
最近在调整自己博客的样式，但不怎么懂前端的知识。
在图片显示的时候希望实现这样的效果：因为图片一般分辨率比较高，直接全尺寸显示的话整个页面布局就乱掉了，所以需要一些样式代码让默认情况下图片显示的时候是一个缩略图，点击图片以后全尺寸的图片能跳出来。
我估计有一些现成的框架可以做这个事情，但我去搜索了一下关键词写不对所以不得要领，这才来这里请教一下，能给一些关键词就可以了，非常感谢！
另外顺便问问有没有方便的命令行图片压缩工具。再次感谢！
在图片显示的时候希望实现这样的效果：因为图片一般分辨率比较高，直接全尺寸显示的话整个页面布局就乱掉了，所以需要一些样式代码让默认情况下图片显示的时候是一个缩略图，点击图片以后全尺寸的图片能跳出来。
我估计有一些现成的框架可以做这个事情，但我去搜索了一下关键词写不对所以不得要领，这才来这里请教一下，能给一些关键词就可以了，非常感谢！
另外顺便问问有没有方便的命令行图片压缩工具。再次感谢！
 | 1 paloalto 2015-08-07 10:44:09 +08:00  1 |
 | 2 TakanashiAzusa 2015-08-07 10:44:44 +08:00 1 fancybox吧。。 |
| 3 paloalto 2015-08-07 11:00:12 +08:00 1 如果硬是要用前端来处理的话 <img class="thumb" src="http://77fmtb.com1.z0.glb.clouddn.com/gogopher.jpg" alt="" /> css： .thumb { max-width: 100%; width: 300px; } 或者 .thumb { max-height: 100%; height: 300px; } 以上两种分别对应以宽度为基准等比缩放、以高度为基准等比缩放，属于比较简单的应用场景，用哪个看具体需求而定。 也可能是宽高比一致的: .thumb { width: 300px; height: 300px; } 也有可能存在这种情况：  这时候就需要用 js 来计算图片大小，之前 kejun 写过一个 demo： http://hikejun.com/demo/photo_layout/layout1.html |
| 4 paloalto 2015-08-07 11:04:56 +08:00 1 啊 发现刚没理解楼主的意思。 fancybox: http://fancyapps.com/fancybox/ lightbox: http://lokeshdhakar.com/projects/lightbox2/ Lightbox for Bootstrap 3: https://github.com/ashleydw/lightbox |
 | 5 Perry 2015-08-07 11:07:55 +08:00 via iPhone 1 photoswipe.js |
 | 6 kevinyoung OP @paloalto 非常感谢 |
 | 7 loddit 2015-08-07 12:28:30 +08:00 这个是 tinypng 背后的工具 https://pngquant.org/ 很厉害。 |
 | 8 dslwind 2015-08-07 21:33:53 +08:00 via Android fancybox 吧 |
 | 9 OpooPages 2015-08-07 22:53:59 +08:00 via Android 用过fancybox和lightbox，比较喜欢fancybox |
Select Language