来自ImageSee官方 JavaScript图片浏览器 原创

使用方法: 访问"imagesee.htm的网址+?pic=图片的网址&page=该图片相关网页的网址" 即可,其中page参数可以忽略。
关于ImageSee:
ImageSee是开放源代码的网页图片浏览器,由JavaScript写成,是一个完全静态网页。同时支持IE Firefox Opera浏览器。

透过ImageSee,您可以方便的对网上的高清图片(大图片)进行浏览,具备常规的图片浏览所需要的全部主要功能:放大缩小、缩略图、图片鼠标拖动。

更多特色:
完全免费开放使用,提供源代码并允许按照您的需要自行修改页面。

纯JavaScript静态页面,完全不需要服务器支持asp/aspx/php等动态脚本,因此适用非常广泛,修改起来也很方便。

浏览者获得更好的浏览图片的感受,您可以额外定制一个页面导航引导机会和一个广告栏。

可以显示任何位置的图片,包括您的网站任何目录和其他网站的图片都可以显示(没有域的限制)。

如何使用:
1.下载压缩包imagesee.rar,展开文件到您的目录,根据您的需要替换loading.gif/welcome.jpg/err.jpg

2.修开ad.htm,在该文件中添加您的广告代码,或者在ad.htm第2行去掉注释符号即可另广告栏不显示

3.把原本的简单图片导航修改为类似 <a href="/imagesee/imagesee.htm?pic=sample1.jpg">sample1</a> 即可

* 如果不带pic参数指定要浏览的图片,则显示welcome.jpg同时显示helpPanel,如同浏览者点击了右上角的“问号按钮”一样。

* 如果要指定该图片的相关网页,请使用page参数(例如&page=http://www.800123.cn/imagesee/),则点击右上角的“相关网页”按钮将导航到该网页。

* 应用举例:您可以把ImageSee上传到您的网站,然后用动态脚本生成图片目录时在链接指向ImageSee从而创建一个很专业的图片浏览环境,ImageSee其实就是一个"网页插件"。

* 其他:作为一个普通浏览者,其实您也可以直接访问ImageSee页面,然后复制/粘贴您要看得图片,这也会给您带来不错的效果 try it now :)

JavaScript代码:
ImageSee完全使用JavaScript实现全部功能,我尽量保持了每个子功能的独立性和阅读方便性(所以部分代码可能看起来比较臃肿,

但我相信他们可以更好的被阅读和摘取),您可以参考和摘取这些源代码。我使用了大量的时间搜集和调试他们,希望能节约您的时间和精力。
官方下载
本地下载

(0)

相关推荐

  • JavaScript仿百度图片浏览效果

    本文实例为大家分享了js图片浏览效果的具体代码,供大家参考,具体内容如下 在线地址:http://www.hui12.com/nbin/demo/imgskim/index.html https://nbin2008.github.io/demo/imgskim/index.html 效果图: index <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>仿

  • javascript上传图片前预览图片兼容大多数浏览器

    复制代码 代码如下: <div id="localImag"><img id="preview" width="-1" height="-1" style="display:none" /></div> <asp:FileUpload ID="file_head" runat="server" onchange="j

  • JavaScript 类似flash效果的立体图片浏览器

    PS:显示效果图,大家可以根据自己的需求调整图片的样式哦代码 复制代码 代码如下: <style type="text/css"> //图片浏览器容器 #container{position:absolute;} #container img{position:absolute;} //半透明遮罩层样式 .mask2{ background:#99FF00; opacity:0.3; filter:Alpha(Opacity='30'); position:absolute

  • 来自国外的一款Js图片浏览效果

    效果图:测试代码: Js图片浏览器 play '; } this.m_mainviewer = this.container.firstChild.cloneNode(true); this.bind(); this.start(); }, writeCanvas : function(id) { document.write(' '); this.container = document.getElementById(id); }, bind : function(obj, evt, fun)

  • javascript IE7 浏览器本地图片预览

    说明: 在对象容器边界内,在对象的背景和内容之间显示一张图片.并提供对此图片的剪切和改变尺寸的操作.如果载入的是PNG(Portable Network Graphics)格式,则0%-100%的透明度也被提供. 语法: filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL ) enabled:可选项.布尔值(Boolean).设

  • 多浏览器兼容的qq图片轮换效果javascript代码

    js图片轮换效果代码_我们 22吨重挖掘机 中星九号直播 考后表情 1 2 3 function $(v){return document.getElementById(v)} var img = $("bimg").getElementsByTagName("div"); var td = $("simg").getElementsByTagName("td"); var text = $("info")

  • js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结 原创

    最近做一个图片的自动缩小效果,发现一直用的js,竟然在firefox下无法正常啊,导致页面变形.所以自己写了个兼容性一般的代码,大家可以来讨论下原来我用的是从pjblog上的 复制代码 代码如下: //查找网页内宽度太大的图片进行缩放以及PNG纠正  function ReImgSize(){   for (i=0;i<document.images.length;i++)    {    if (document.all){     if (document.images[i].width>

  • jb51站长推荐的用js实现的多浏览器支持的图片轮换展示效果ie,firefox

    jb51站长推荐的用js实现的多浏览器支持的图片轮换展示效果在ie,firefox和测试一切正常,建议以后大家都要用这样的兼容性比较好的代码 body {margin:0 auto; padding:0; text-align:center } .box400 {margin:0 auto;padding:0;width:400px} #f_menu { MARGIN: 0px auto; OVERFLOW: hidden; WIDTH: 400px; HEIGHT: 20px } #f_men

  • JS预览图像将本地图片显示到浏览器上

    复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript"&

  • 浏览器图片选择预览、旋转、批量上传的JS代码实现

    工作中遇到的业务场景,和同事一起研究了下,主要是为了兼容IE版本 其实就是一些琐碎的知识点在网上搜集下解决方式,然后集成了下,主要有以下点: 1. IE input type=file的图片预览要用IE的filter css progid:DXImageTransform.Microsoft.AlphaImageLoader chrome/firefox则用File api的file reader 2. 图片旋转,IE用progid:DXImageTransform.Microsoft.Matr

随机推荐