082007

这两个网站是我所看到比较经典的JS图片放大效果网站:

前者是在页面内缩放,后者是采用的“全屏”效果,我看后者的代码稍微简单一些,就采用了后者,不过也借鉴了前者的一个放大镜图标,这样有助于提醒访问者他所看到的这幅图片时可以继续放大的;不过这个图标还费了我半天劲才让它在IE中也显示出来,主要是IE对CSS中文件路径的解析比较奇怪,而Firefox就能正确解析出来。

那么以后本站中的图片就可以有缩放效果啦!而且对于多幅图片,还可以以幻灯方式依次浏览,嗯,8错8错。

爷还想看:

4 Responses to “网页中的图片点击放大效果:Highslide和Lightbox”

Comments (3) Pingbacks (1)
  1. hans 说:

    请教一下啊。。达人,,,如果我整个网页的定位是
    margin-top: -298px;
    margin-right: 0px;
    margin-bottom: 0px;
    top: 50%;
    height: 597px;
    position: absolute;
    left: 50%;
    width: 1003px;
    margin-left: -501px;

    就是一个1003X597分辨率的表格定位在页面的中间,直接套用lightbox中会产生一个问题,就是黑色背景在页面中会显示上下不对称,下面部分多出一截来,请问怎样设置才能使黑色背景全屏幕显示又不多出来。

    万分感谢!!

  2. 免费情结 说:

    “前者的一个放大镜图标,这样有助于提醒访问者他所看到的这幅图片时可以继续放大的”
    的确很赞同。。找了好多 都没有呀。。 有一个 插件可直接实现 Overlay4WP 不过需要发表文章是ref=gallery

    我用 的是 zoundry 自带的 可以自动 ref=lightbox 无奈只能用lightbox了。。但就是没有放大镜图标。。

Leave a Reply

(required)

(required)

WWW.YIHUI.NAME XIE@YIHUI.NAME © 2007 - 2010 by Yihui Xie