鼠标滑至某位置,在鼠标旁边出现详情弹窗div
首先效果如下:

代码如下:
//这个是一个循环,循环所有name为xx的td标签(也就是给tdname为XXX的添加事件)
$("td[name='strGoodsSKU']").each(function(index,item){
var oldTest = $(this).text();
//如果td里的text长度大于了30个字符的话,后面的字符替换成。。。
if($(this).text().length>30){
var newText = $(this).text().substring(0,30);
$(this).text(newText+"...");
}
//开始添加鼠标滑过事件,传递两个function,function1为滑进事件,function2为滑出事件
$(this).hover( function () {
//添加一个div,给div设置样式,并且显示到鼠标的旁边
$(document.body)
.append($('<div id="follower" style="width:500px;height:80px;border:1px solid #000;background:#e1e1e1;position:absolute"></div>'))
.mousemove(function(e){
$("#follower").text(oldTest).css({top:e.pageY+10,left:e.pageX+10})
})
},function(){
//移除显示div
$("#follower").remove();
});
/* $(this).mouseleave( function () { }); */
});
鼠标滑至某位置,在鼠标旁边出现详情弹窗div的更多相关文章
- unity中让摄像机移动到鼠标点击的位置和鼠标控制平移视角
private Vector3 targetVector3; private float movespeed=0.5f; private bool IsOver = true; private Gam ...
- jQuery hover事件鼠标滑过图片半透明标题文字滑动显示隐藏
1.效果及功能说明 hover事件制作产品图片鼠标滑过图片半透明,标题文字从左到右滑动动画移动显示隐藏 2.实现原理 首先把效果都隐藏,然后定义一个伪类来触发所有的效果,接下来当触发伪类后会有一个遍历 ...
- 鼠标滑过侧边弹出内容(JS)
效果展示 实现原理 1. html结构: <div id="contain"> <span id="share">分享</span ...
- [JQuery代码]超酷鼠标滑过背景高亮效果
1.效果及功能说明 鼠标滑过悬停特效,div css制作产品列表图片布局通过鼠标滑过产品图片背景高亮闪烁显示,产品标题滑动显示或隐藏 2.实现原理 首先定义好一个重复实现效果的方法,然后定义光带出现速 ...
- echarts中跨域动态获取数据时,当某些对应的数据为空时,鼠标滑动到所在位置卡死
才疏学浅,万望指点. formatter: function (params) { var rel = params[0].name + "<br />"; rel + ...
- Qt 样式表鼠标滑过按钮更改Text文本颜色
QSS语法参考http://blog.csdn.net/liang19890820/article/details/51691212 Qt助手上也有比较详细的说明,选择器以及伪选择器,现在只是做个简单 ...
- CSS3鼠标滑过图标放大以及旋转
本人是HTML5-CSS3初学者,这次分享一款纯CSS3实现的图片动画,当鼠标滑过小图标时,图标会放大,同时图标会出现旋转的动画效果.我们在很多个性化个人博客中经常看到鼠标滑过人物头像后头像图片旋转就 ...
- CSS3鼠标滑过动画线条边框特效
基于CSS属性animation动画制作,效果流畅弹性十足 效果展示 http://hovertree.com/texiao/css3/32/ 源码下载:http://hovertree.com/h/ ...
- 鼠标滑过图片变暗文字链接滑出jQuery特效
效果体验:http://hovertree.com/texiao/jquery/7.htm HTML文件代码: <!DOCTYPE html> <html xmlns="h ...
随机推荐
- windows IIS发布.net core网站的环境配置
1.安装对应的.net core的runtime2.安装Windows Server Hosting下载地址:https://www.microsoft.com/net/download/core#/ ...
- ControlTemplate
ControlTemplate:外观定制 <Window.Resources> <ControlTemplate x:Key="CheckBoxControlTemplat ...
- 【推荐网站】下载国外网盘+强大的离线下载站—offcloud.com
博主在网上浏览时看到一篇帖子,推荐了一个离线下载网站–offcloud.com,支持上传种子文件.磁力链和几十家网盘的直连下载,厉害了我的哥,这是个啥网站这么666.即使之前咱们写了几篇文章来自建下载 ...
- Vmware 占用宿主机硬盘空间只增不减
问题: vmware 占用硬盘空间只增大不减少.即使你删除虚拟机系统里面的文件,占用宿主机的硬盘空间也不释放.用了一段时间后空间不够了. 解决办法: 方法一: 把一部分*sxxx.vmdk文件剪切到其 ...
- 图片处理拓展篇 : 图片转字符画(ascii)
首先要明确思路, 图片是由像素组成的, 不同的像素有不同的颜色(rgb), 那么既然我们要转化为字符画, 最直接的办法就是利用字符串来替代像素, 也就是用不同的字符串来代表不同的像素. 另外图片一般来 ...
- golang生成c-shared so供c语言或者golang调用到例子
1.golang生成c-shared类型到so 建立文件夹hello,创建main.go文件,内容如下 package main import "C" func main() {} ...
- SQL之连接查询
这几天忙着笔试.面试,遇到了好几个关于数据库的试题,当然只是简单的多表查询.我第一时间都是选择select...from...where...group by...having...这个结构去写的.但 ...
- SignalR的简单使用(二)
原文:SignalR的简单使用(二) 之前提到SignalR代理在网页,通过生成的Js来完成相关的功能.但我不禁想一个问题, 难到SignalR的服务端就能寄存在web端吗,通过访问网页能方式才能启动 ...
- Android零基础入门第55节:ImageSwitcher和TextSwitcher使用
原文:Android零基础入门第55节:ImageSwitcher和TextSwitcher使用 上一期我们了解了ViewAnimator组件和ViewSwitcher组件的使用,你都掌握了吗?本期一 ...
- spring通过注解方式依赖注入原理 (私有成员属性如何注入)
一.spring如何创建依赖的对象 用过spring的都知道我们在dao.service层加上@repository.@Service就能将这两个对象交给spring管理,在下次使用的时候使用@res ...