Home > Web Front-end > HTML Tutorial > Why can't the mouseover effect appear?_html/css_WEB-ITnose

Why can't the mouseover effect appear?_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:22:15
Original
1558 people have browsed it

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>  <head>    <title>MyHtml.html</title>	    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">    <meta http-equiv="description" content="this is my page">    <meta http-equiv="content-type" content="text/html; charset=UTF-8">        <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->	<style type="text/css">	.outer:hover .inner{		display: none;	}	</style>  </head>    <body>  	 <div class="outer" >  	 	鼠标滑过这里的时候  	 	<div class="inner">这里为什么当鼠标滑过不隐藏呢?</div>  	 </div>  </body></html>
Copy after login


Reply to discussion (solution)

Currently not all browsers support the :hover pseudo-class writing method of tags, such as (except outside the tag)~~~
It is best to use JS to achieve the hiding effect

Currently not all browsers support the :hover pseudo-class writing method of tags, such as (except outside the tag)~~~
It’s best to use JS to achieve the hiding effect

    <script src="JS/jquery-1.7.1.min.js"></script>    <script>        $(function () {            $(".outer").hover(function () {                $(this).find(".inner").hide();            }, function () {                $(this).find(".inner").show();            });        });    </script>
Copy after login

You tested it under IE, right? Press F12 to set the document mode Just meet the non-Quirks standards

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template