zoukankan      html  css  js  c++  java
  • jQuery实现鼠标悬停显示提示信息窗口的方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <head>
    <title>鼠标悬停显示提示信息窗口</title>
    <meta http-equiv="content-type" content="text/html;charset=gb2312">
    <style type="text/css">
    .contact{100px;height:15px;
    margin:20px 0 0 50px; padding: 0px 0px 0px 5px; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; border-left: 3px solid rgb(108, 226, 108); line-height: 20px; 640px; clear: both; border-radius: 0px !important; border-top: 0px !important; border-right: 0px !important; border-bottom: 0px !important; border-image: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; box-sizing: content-box !important; font-family: Consolas, "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important; min-height: auto !important; color: gray !important;">#CCCCCC;
    text-align:center;
    }
    .us{display:none;300px;height:40px;
    padding:10px;position:relative;top:0px;left:50px;
    padding: 0px 0px 0px 5px; background-image: initial; background-position: initial; background-size: initial; background-repeat: initial; background-attachment: initial; background-origin: initial; background-clip: initial; border-left: 3px solid rgb(108, 226, 108); line-height: 20px; 640px; clear: both; border-radius: 0px !important; border-top: 0px !important; border-right: 0px !important; border-bottom: 0px !important; border-image: initial !important; bottom: auto !important; float: none !important; height: auto !important; left: auto !important; outline: 0px !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; vertical-align: baseline !important; box-sizing: content-box !important; font-family: Consolas, "Bitstream Vera Sans Mono", "Courier New", Courier, monospace !important; min-height: auto !important; color: gray !important;">#0099FF;
    }
    </style>
    <script src="jquery-1.6.2.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $(".contact").mouseover(function(){
    $(".us").show("slow");
    $(".contact").mouseout(function(){
    $(".us").hide("slow");
    });
    });
    })
    </script>
    </head>
    <body>
    <div class="contact">联系我们</div>
    <div class="us">提示内容!提示内容!提示内容!</div>
    <div>http://www.jb51.net/</div>
    </body>
    </html>
  • 相关阅读:
    druid-1.0.13 数据库配置文件密码加密
    PostConstruct注解
    easyui formatter 返回easyui组件
    小师妹问 easyUI mergeCells 行合并后表头和内容对不齐
    Java Split以竖线作为分隔符
    Integer比较值的时候小心使用
    js 关键字 in
    Asp.net中防止用户多次登录的方法
    C#取得站点跟目录
    解读支付宝接口实现步骤
  • 原文地址:https://www.cnblogs.com/sjqq/p/6388085.html
Copyright © 2011-2022 走看看