Rumah > hujung hadapan web > html tutorial > 为什么鼠标滑过效果出不来呢?_html/css_WEB-ITnose

为什么鼠标滑过效果出不来呢?_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 12:22:15
asal
1604 orang telah melayarinya

<!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>
Salin selepas log masuk


回复讨论(解决方案)

目前不是所有浏览器都支持标签的:hover伪类写法的,如(除标签外)~~~
最好用JS实现隐藏效果咯

目前不是所有浏览器都支持标签的:hover伪类写法的,如(除标签外)~~~
最好用JS实现隐藏效果咯

    <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>
Salin selepas log masuk

你是在IE下测试的吧,按F12把文档模式设置成 非Quirks标准就可以了

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan