<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>Jquery使用mouseenter和mouseleave实现鼠标经过弹出层且可以点击</title>

    <script src="JS/jquery-1.9.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function () {

            var ps = $("#div_pro").position();

            $("#float_box").css("position", "absolute");

            $("#float_box").css("left", ps.left + 20); //距离左边距

            $("#float_box").css("top", ps.top + 20); //距离上边距

            $("#div_pro").mouseenter(function () {

                $("#float_box").show();

            });

            $("#float_box").mouseleave(function () {

                $("#float_box").hide();

            });

        })

    </script>

</head>

<body>

    <div>

        <a href="#" id="div_pro">广东省</a>

    </div>

    <div id="float_box" style="display:none;">

        <a href="#">深圳市</a>

        <a href="#">广州市</a>

        <a href="#">东莞市</a>

    </div>

</body>

</html>

Jquery使用mouseenter和mouseleave实现鼠标经过弹出层且可以点击的更多相关文章

  1. jquery鼠标经过弹出层写法

    jquery鼠标经过弹出层写法<pre><div class="navitem"><a href="/index.php?c=news&am ...

  2. 【position也可以很复杂】当弹出层遇上了鼠标定位（下）

    前言 接着昨天的内容写,为了保证内容连续性,这里还是把昨天的内容拷了过来. 请用现代浏览器测试 引出问题 有图有真相,我们来看一个智联招聘里面经常出现的图层: 他这个是没有什么问题的,我们来简单看看其 ...

  3. 【position也可以很复杂】当弹出层遇上了鼠标定位（上）

    前言 周五时同事有一个关于弹出层的问题没有解决,但是面临下班问题,我有点不舒服,便叫回去周六过来解决,但是上周六病了,所以请了个假,于是故事发生啦.... 今天上班时候,组员们卡到了那个地方,然后结果 ...

  4. [转]jquery Fancybox丰富的弹出层效果

    本文转自:http://www.helloweba.com/view-blog-65.html Fancybox是一款优秀的jquery插件,它能够展示丰富的弹出层效果.前面我们有文章介绍了facyb ...

  5. jQuery WIN 7透明弹出层效果

    jQuery WIN 7透明弹出层效果,点击可以弹出一个透明层的jquery特效,插件可以调弹出框的宽度和高度,很不错的一个弹出层插件. 适用浏览器:IE8.360.FireFox.Chrome.Sa ...

  6. Jquery地图热点效果-鼠标经过弹出提示信息

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  7. jQuery Dialog弹出层对话框插件

    Dialog.js的相关注释已经添加,可以按照注释,进行相关样式的修改,适用于自定义的各个系统! dialog.js /** * jQuery的Dialog插件. * * @param object ...

  8. 如何不使用js实现鼠标hover弹出菜单效果

    最近看到很多同学在实现鼠标hover弹出菜单的效果时都是用的js代码去实现的,默认给弹出隐藏掉,通过js事件绑定动态的显/隐弹出菜单元素. <ul> <li>主页</li ...

  9. 弹出层之2：JQuery.BlockUI

    JQuery.BlockUI是众多JQuery插件弹出层中的一个,它小巧(原版16k,压缩后10左右),容易使用, 功能齐全,支持Iframe,支持Modal,可定制性高也意味他默认谦虚的外表. jQ ...

随机推荐

  1. .net asp mvc 如何从后端返回数据对象

    今天在做项目时,有一个需求:获取从控制器返回的数组对象,方法如下 public ActionResult GetAllFiles() { string dir = Server.MapPath(&qu ...

  2. group by 详解

    1.概述 2.原始表 3.简单Group By 4.Group By 和 Order By 5.Group By中Select指定的字段限制 6.Group By All 7.Group By与聚合函 ...

  3. JavaScript封装一个MyAlert弹出框

    平时我们想要显示一些提示信息时会用到alert方法,alert是全局的一个方法,会短暂的中断程序,我们主要用来显示提示客户信息.但是这个方法有一定的局限性,而且本身样式也不够美观.于是我封装了一个实用 ...

  4. SNS团队Beta阶段第二次站立会议（2017.05.23）

    1.立会照片 2.每个人的工作 每个成员的分工: 成员 今天已完成的工作 明天计划完成的工作 罗于婕 完善代码规范文档 辅助完善生词本 龚晓婷 界面优化  辅助开发新功能 林仕庄 界面图标不对齐bug ...

  5. Git和Github使用

    什么是Git? Git 是一个快速.可扩展的分布式版本控制系统,它具有极为丰富的命令集,对内部系统提供了高级操作和完全访问. 版本控制 简单地说,就是将在本地开发的代码,定时推送到服务器.每一次修改, ...

  6. 201521123025<<java程序设计>>第4周学习总结

    Q1. 本周学习总结 Q2.书面作业 1.注释的应用 使用类的注释与方法的注释为前面编写的类与方法进行注释,并在Eclipse中查看.(截图) 2.面向对象设计(大作业1,非常重要) 2.1 将在网上 ...

  7. 201521123077 《Java程序设计》第11周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 线程的同步(加锁防止多个线程同时访问) synchronized关键字修饰 可以使用于方法前或者方法内做同步 ...

  8. 在Ubuntu中部署并测试Fabric 1.0 Beta

    [更新:1.0Beta已经是过去式了,现在出了1.0.0的正式版,请大家参照 http://www.cnblogs.com/studyzy/p/7437157.html  安装Fabric 1.0.0 ...

  9. 个人-GIT使用方法

    团队开发中,遵循一个合理.清晰的Git使用流程,是非常重要的. 1.Git库中由三部分组成        Git 仓库就是那个.git 目录,其中存放的是我们所提交的文档索引内容,Git 可基于文档索 ...

  10. JSP引入 - UEditor 富文本编辑器

    UEditor  JSP 因为是项目第一天就导入了,现在过去一个多星期了,可能会有问题 官网:http://ueditor.baidu.com/website/ 1. 解压对应的UEditor压缩包至 ...