添加引用

<link rel="stylesheet" media="screen" type="text/css" href="zoomimage/common.css" />

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="zoomimage/content_zoom.js"></script>

图片代码

<p class="quiz_details">

<a href="#show" title="查看大图">
          <img  alt=""  src="1.gif"  />
  </a>

<div id="show" style=" display:none;">
        <img  alt=""  src="1.gif" />
     </div>

</p>

<script type="text/javascript">
      $(document).ready(function () {
          $('p.quiz_details a').fancyZoom({ scaleImg: true, closeOnClick: true ,width:500,height:500});
});
</script>

查看大图 zoomImage的更多相关文章

  1. [原创]WKWebview点击图片查看大图

    大家都知道,WKWebview是没有查看大图的属性或者方法的,所以只能通过js与之交互来实现这一功能,原理:通过js获取页面的图片,把它存放到数组,给图片添加点击事件,通过index显示大图就行了 其 ...

  2. IOS第六天(1:scrollView 属性和查看大图)

    ***查看大图 #import "HMViewController.h" @interface HMViewController () <UIScrollViewDelega ...

  3. jquery层居中,点击小图查看大图,弹出层居中代码,顶部层固定不动,滚动条滚动情况

    jquery层居中,点击小图查看大图,弹出层居中代码 http://www.cnblogs.com/simpledev/p/3566280.html 见第一版,发现一个情况,如果页面内容多出一屏的情况 ...

  4. android开发:点击缩略图查看大图

    android中点击缩略图查看大图的方法一般有两种,一种是想新浪微博list页面那样,弹出一个窗口显示大图(原activity为背景).另一种就是直接打开一个新的activity显示大图. 1.第一种 ...

  5. WKWebview点击图片查看大图

    大家都知道,WKWebview是没有查看大图的属性或者方法的,所以只能通过js与之交互来实现这一功能,原理:通过js获取页面的图片,把它存放到数组,给图片添加点击事件,通过index显示大图就行了 其 ...

  6. Android下QQ空间查看大图特效

    近期在做一个项目,里面有一个功能是实现Android QQ好友动态里面的缩略图放大,查看大图的效果.用过都知道,这个特效非常赞的,没用过的下载个玩玩吧.我刚開始以为放大的那个大图是一个Activity ...

  7. 点击图片查看大图(纯js)

    $(function(){ $(".pimg").click(function(){ var _this = $(this);//将当前的pimg元素作为_this传入函数 img ...

  8. 查看大图、html查看大图、js查看大图

    $(".pimg").click(function(){ var _this = $(this);//将当前的pimg元素作为_this传入函数 imgShow("#ou ...

  9. vue-图片预览,查看大图

    [前言] 在 vue 项目中经常碰到图片预览需求,也就是点击小图查看大图.也有一些这样的第三方插件,如 vue-preview 等.但使用起来感觉版本经常变,而且有时 UI 需要在预览页面上加更多的东 ...

随机推荐

  1. MornUI 源码阅读笔记

    1. label的mouseChildren属性为true,但label本身是不需要监听textfield的任何事件的, 个人猜测是为了给TextInput, TextArea用的,因为后两者需要监听 ...

  2. redis 在centos下的安装部署

    安装的redis版本是 redis-3.0.2 请严格按照以下步骤进行 可以免除以下错误 1 make[2]: cc: Command not found 异常原因:没有安装gcc 解决方案:yum ...

  3. 三:分布式事务一致性协议2pc和3pc

    一:分布式一致性协议--->对于一个分布式系统进行架构设计的过程中,往往会在系统的可用性和数据一致性之间进行反复的权衡,于是就产生了一系列的一致性协议.--->长期探索涌现出一大批经典的一 ...

  4. Jquery实现文本框输入提示

    一些用户体验好的表单都会在文本框里设置输入提示,文本框获取焦点时,提示内容消息,如果未输入,失去焦点时又会出现提示. 网上找到一个比较好用的控件jquery.inputDefault.js 使用方法: ...

  5. c# datagridview表格控件常用操作

    1) 行右键菜单 private void dataGridView1_CellMouseDown(object sender, DataGridViewCellMouseEventArgs e) { ...

  6. 编译及load mydqli.so文件

    (1)cd /usr/local/php-5.2.17/ext/mysqli(2)输入/usr/local/php/bin/phpize 回车(3)./configure --prefix=/usr/ ...

  7. Suse linux 11 SP2 nginx 使用笔记

    1. 下载源代码 http://nginx.org/en/download.html   2. DAV模块缺省没有编译,要加入编译选项 # ./configure --with-http_dav_mo ...

  8. Dev GridView 获取选中分组下的所有数据行 z

    现在要在DevExpress 的GridView 中实现这样一个功能.就是判断当前的选中行是否是分组行,如果是的话就要获取该分组下的所有数据信息. 如下图(当选中红框中的分组行事.程序要获取该分组下的 ...

  9. 用Delphi实现文件关联

      文件关联为我们带来很多的方便.Delphi自带有注册表对象TRegistry,可以通过它取得或改变注册表相关键值的内容. Function GetAssociatedExec(FileExt: S ...

  10. selenium python (六)定位一组对象

    checkbox源码: <html><head><meta http-equiv="content-type" content="text/ ...