jquery.elevatezoom.js文件请到演示文件查看

JavaScript Code
  1. <script type="text/javascript">
  2. $(document).ready(function() {
  3. $(".zoom").elevateZoom({
  4. easing : true,
  5. borderSize: 1,
  6. showLens: true,
  7. borderColour: "#fff",
  8. });
  9. });
  10. </script>
XML/HTML Code
  1. <div class="container">
  2. <center>
  3. <img class="zoom" src="../dalian.jpg" width="100" data-zoom-image="../dalian.jpg"/>
  4. <img class="zoom" src="../xianggang.jpg" width="100" data-zoom-image="../xianggang.jpg"/>
  5. </center>
  6. </div>

原文地址:http://www.freejs.net/article_jquerytupiantexiao_89.html

jquery 鼠标经过放大图片的更多相关文章

  1. 基于jquery鼠标点击图片翻开切换效果

    基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class=&quo ...

  2. jquery点击放大图片

    参考地址:https://blog.csdn.net/qq_42249896/article/details/86569636 一.应用场景:点击图片可以对图片进行放大显示. 二.实现代码: 说明:我 ...

  3. jQuery鼠标悬停图片放大显示

    jQuery鼠标悬浮放于图片上之后图片放大显示的效果,即鼠标移到图片上图片突出显示,鼠标移开后恢复原来的模样,你可以在图片滚动效果中加上本特效,相信会更炫一些. <!DOCTYPE html P ...

  4. jQuery的鼠标悬停时放大图片的效果

    这是一个基于jQuery的效果,当鼠标在小图片上悬停时,会弹出一个大图,该大图会跟随鼠标的移动而移动.这个效果最初源于小敏同志的一个想法,刚开始做的时候只能实现弹出的图片是固定的,不能随鼠标移动,最后 ...

  5. 基于jQuery的鼠标悬停时放大图片的效果制作

    这是一个基于jQuery的效果,当鼠标在小图片上悬停时,会弹出一个大图,该大图会跟随鼠标的移动而移动.这个效果最初源于小敏同志的一个想法,刚开始做的时候只能实现弹出的图片是固定的,不能随鼠标移动,最后 ...

  6. 鼠标滑过图片变暗文字链接滑出jQuery特效

    效果体验:http://hovertree.com/texiao/jquery/7.htm HTML文件代码: <!DOCTYPE html> <html xmlns="h ...

  7. jquery插件jquery.LightBox.js之点击放大图片并左右点击切换图片（仿相册插件）

    该插件乃本博客作者所写,目的在于提升作者的js能力,也给一些js菜鸟在使用插件时提供一些便利,老鸟就悠然地飞过吧. 此插件旨在实现目前较为流行的点击放大图片并左右点击切换图片的效果,您可以根据自己的实 ...

  8. jQuery hover事件鼠标滑过图片半透明标题文字滑动显示隐藏

    1.效果及功能说明 hover事件制作产品图片鼠标滑过图片半透明,标题文字从左到右滑动动画移动显示隐藏 2.实现原理 首先把效果都隐藏,然后定义一个伪类来触发所有的效果,接下来当触发伪类后会有一个遍历 ...

  9. 前端jquery实现点击图片弹出大图层(且滚动鼠标滑轮图片缩放)

    <img src="{$vo.photo}" height="50px" onclick="showdiv({$i});"> & ...

随机推荐

  1. bzoj3551 3545

    我直接来讲在线好了 这是一个很巧妙的方法,把边作为一个点 做一遍最小生成树,当加如一条边时,我们把这条边两点x,y的并查集的根i,j的父亲都设为这条边代表的点k,由k向i,j连边 这样我们就构建出一棵 ...

  2. GridView表头排序方法设置

    1.效果图 2.前台代码 说明:红色代码为核心代码 <asp:GridView ID="gvData" runat="server" AutoGenera ...

  3. 晶振波形、MIPI波形

    /********************************************************************************** * 晶振波形.MIPI波形 * ...

  4. HDU 2544 最短路 （最短路，spfa）

    题意:中文题目 思路:spfa+SLF优化.关于SPFA的详情请戳我 #include <bits/stdc++.h> using namespace std; , INF=0x7f7f7 ...

  5. apache开源项目 -- tez

    为了更高效地运行存在依赖关系的作业(比如Pig和Hive产生的MapReduce作业),减少磁盘和网络IO,Hortonworks开发了DAG计 算框架Tez.Tez是从MapReduce计算框架演化 ...

  6. 【C#学习笔记】写文件

    using System; using System.IO; namespace ConsoleApplication { class Program { static void Main(strin ...

  7. 省市区(县)三级联动代码（js 数据源）

    ylbtech-JavaScript-Utility:省市区(县)三级联动代码(js 数据源) 省市区(县)三级联动代码(js 数据源) 1.A,源代码(Source Code)返回顶部 1.A.1, ...

  8. aggregation（2）：adaptive Boosting （AdaBoost）

    给你这些水果图片,告诉你哪些是苹果.那么现在,让你总结一下哪些是苹果? 1)苹果都是圆的.我们发现,有些苹果不是圆的.有些水果是圆的但不是苹果, 2)其中到这些违反"苹果都是圆的" ...

  9. 多校6 1001 HDU5793 A Boring Question (推公式 等比数列求和)

    题解:http://bestcoder.hdu.edu.cn/blog/ 多校6 HDU5793 A Boring Question // #pragma comment(linker, " ...

  10. Tkinter教程之Event篇(2)

    本文转载自:http://blog.csdn.net/jcodeer/article/details/1823548 '''Tkinter教程之Event篇(2)''''''5.测试离开(Leave) ...