三月 02, 2007
给网站的Google Maps链接加上Lightbox效果
由. Ken Wong 将文章归档于 G源共享
我相信不少读者朋友早已经知道"Lightbox"是什么了。简单地说，它是一组JS脚本，通过给网站添加这些脚本，可以使网站的图片被点击后，实现动态显示，即使图片尺寸比网站的主框架大，也可以即时在当前窗口打开，点击者并不需要离开当前网页。一直以来，类似的Lightbox JS脚本只针对普通图片有效。对于我们Google Fans而言，我们经常会在网站里加上Google Maps的链接，让读者点击进入Google Maps网站观看。那么有没有办法可以让网站上的Google Maps链接也实现Lightbox效果呢？
我们只需要利用Mich编写的Google Maps Lightbox JS脚本即可达到目的。效果可见上图，则当读者点击了添加了Google Maps Lightbox JS脚本的网站里的Google Maps链接时，可即时动态地在当前页浏览Google Maps，不必再打开新网页。特别是在RSS阅读器里，读者可以直接在RSS阅读界面内浏览Google Maps，非常方便。
实现的方法类似于实现普通的针对图片的Lightbox效果，即通过给网站加载相应的Javascript及CSS文件，然后激活它们即可。如果你之前对Lightbox的实现方法一无所知，强烈建议先参考蓝色的教程，或者fisker之前给出的步骤。Mich给出的步骤如下：
1.下载Google Maps Lightbox，解压并上传至你的空间；
2.如果你之前没有申请过Google Maps key，请点击这里申请一个；
3.分别把gmlightbox.js和gmlightbox.css文件以代码方式加载进网页的适当位置，具体做法可参见上面的蓝色教程。类似于：
< script src = "http://你的网站具体路径/gmlightbox/gmlightbox.js" type="text/javascript" >< /script >
< link href = "http://你的网站具体路径/gmlightbox/gmlightbox.css" rel="stylesheet"/ >
完成之后，在网页里添加Google Maps链接里，使用下面的格式即可：
< a href="Google Maps链接" rel="gmap" >文字说明< /a >
由于条件限制，实例演示请到Mich的网站里点击观看。
固定链接: 给网站的Google Maps链接加上Lightbox效果
关键词:
Google Maps Lightbox JS 动态 效果 技巧
引用: http://www.creative-weblogging.com/cgi-bin/mt-tb.pl/56083
