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>
  • 相关阅读:
    从VS转MyEclipse的15天使用体验
    JSP标签
    cookie实现自动登录
    js中substring和substr的用法
    用原生sql查询返回实体对象的方法
    @Column
    event.keyCode用法及列表
    jQuery的选择器中的通配符[id^='code']
    struts2中<s:radio>标签设置默认选中项
    在Struts2中实现登陆后跳转到登录前页面
  • 原文地址:https://www.cnblogs.com/sjqq/p/6388085.html
Copyright © 2011-2022 走看看