JQuery鼠标移动上去显示预览图
body中:
<img src="../images/icon_view.gif" bigimg="../img.jpg" title="查看预览图" class="imgtip" />
<script type="text/javascript">
//放大图片
$(function () {
var x = ;
var y = ;
$(".imgtip").mouseover(function (e) {
this.myTitle = this.title;
this.title = "";
var imgtip = "<div id='imgtip'><img src='" + $(this).attr("bigimg") + "' width='300' alt='预览图'/><\/div>"; //创建 div 元素
$("body").append(imgtip); //把它追加到文档中
$("#imgtip")
.css({
"top": (e.pageY + y) + "px",
"left": (e.pageX + x) + "px"
}).show("fast"); //设置x坐标和y坐标,并且显示
}).mouseout(function () {
this.title = this.myTitle;
$("#imgtip").remove(); //移除
}).mousemove(function (e) {
$("#imgtip")
.css({
"top": (e.pageY + y) + "px",
"left": (e.pageX + x) + "px"
});
});
});
</script>
JQuery鼠标移动上去显示预览图的更多相关文章
- win7图片只显示图标不显示预览图解决方案
问题描述: win7上图片只显示图标,不显示缩略图:不管是调节小图.中图还是大图或者其他均不显示:而且这种情况下使用截图工具截下来的图片都不自动带上扩展名:情况如下图: 解决方案: 打开计算机-> ...
- 在GeoServer里设置图层的默认自定义样式,出现不显示预览图的情况(不起作用)
在GeoServer里设置图层的默认自定义样式 点击"Layers-->world:country"图层,点击"Publishing"标签,在下面的&qu ...
- 可拖拽和带预览图的jQuery文件上传插件ssi-uploader
插件描述:ssi-uploader是一款带预览图并且可以拖拽文件的jQuery ajax文件上传插件.该文件上传插件支持AJAX,支持多文件上传,可控制上的文件格式和文件大小,提供各种回调函数,使用非 ...
- jQuery+Ajax实现图片的预览和上传
jQuery+Ajax实现图片的预览和上传 1.配置Spring-web.xml <!-- springmvc上传图片 --> <bean id="multipartRes ...
- HTML5-video标签-实现点击预览图播放或暂停视频
HTML5-video标签-实现点击预览图播放或暂停视频 刚刚参加工作,开始更多的接触到一些新的知识,促使我开始了解html5和css3的新特性.这时我才真的发现到html5和css3的强大. 之前关 ...
- Jquery 下实现 图片大图预览效果
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- PHP如何生成文章预览图
PHP如何生成文章预览图 一.总结 一句话总结:php的wkhtmltox扩展,php官方文档有怎么使用,或者github,或者百度,等等等等 wkhtmltox 1.PHP如何自动生成文章预览图? ...
- 资源管理器总是生成 avi,mpeg的预览图
感觉非常讨厌. 图片可以直接显示,但是视频的预览图感觉很不舒服. 查了一下 , 用ShellExView 禁用一下 MF XXXX Property Handler 就可以了. 官网最下面可以下载: ...
- Jquery.Treeview+Jquery UI制作Web文件预览
效果图: 前台Html: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="D ...
随机推荐
- vim下的ctags和taglist等的使用和配置
1.ctags (1)到 http://prdownloads.sourceforge.net/ctags/ctags-5.6.tar.gz 下载ctags源码ctags-5.6.ta ...
- linux基础part2
linux基础 一.linux基础命令 1.pwd:用来显示当前目录位置 2.cd:用来切换目录位置.(eg:cd...cd../...cd-.cd~) 3.ls:用来查看目录或文件信息(eg:ls ...
- Linux基础系列:常用命令(6)_nfs服务与nginx服务
NFS介绍: NFS 是Network File System的缩写,即网络文件系统.一种使用于分散式文件系统的协定,由Sun公司开发,于1984年向外公布.功能是通过网络让不同的机器.不同的操作系统 ...
- windows下SecureCRT无法使用backspace(空格键)和上下左右键
在使用SecureCRT登陆liunx(我的为CenterOS)系统,发现删除(backspace)键.和上下左右键不起作用,郁闷了很久没有找到解决办法, 今天终于看到了一篇有用的文章,在此记录一下! ...
- 每天一个Linux命令(22)find命令_命令详解
find命令的一些常用参数的常用实例和用时的注意事项. 实例: (1)-name参数: 1)[sunjimeng@localhost home]$ find ~ -name & ...
- Linux电源管理(1)-整体架构【转】
本文转载自:http://www.wowotech.net/pm_subsystem/pm_architecture.html 1. 前言 在这个世界中,任何系统的运转都需要能量.如树木依靠光能生长, ...
- codeforces 466C 计数 codeforces 483B 二分 容斥
题意:给你n个数,将他们分成连续的三个部分使得每个部分的和相同,求出分法的种数. 思路:用一个数组a[i]记下从第一个点到当前i点的总和.最后一个点是总和为sum的点,只需求出总和为1/3sum的点和 ...
- codeforces 627B B. Factory Repairs(线段树)
B. Factory Repairs time limit per test 4 seconds memory limit per test 256 megabytes input standard ...
- 【遍历二叉树】11把二叉树转换成前序遍历的链表【Flatten Binary Tree to Linked List】
本质上是二叉树的root->right->left遍历. +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ...
- Arc073_F Many Moves
传送门 题目大意 有$n$个格子从左到右依次挨着,一开始有两枚棋子分布在$A,B$某一个或两个格子里,有$m$个操作,第$i$次操作要求你把其中一个棋子移到$X_i$上,移动一个棋子的代价是两个格子之 ...