css的hover变换被另一个frameset遮住了,z-index好像不能通过frameset作用于另一个frameset(遮不住!) 20
<!DOCTYPEhtml><html><head><styletype="text/css">*{margin:0;padding:0;}frameset{border...
<!DOCTYPE html><html> <head> <style type="text/css"> * {margin:0;padding:0;} frameset {border:0;} </style> <title>学生会体育部首页</title> </head> <frameset rows="23%,*" frameborder="NO"> <frame src="banner.html" noresize="noresize" scrolling="no"> <frame src="test.html" noresize="noresize"> </frameset> </html>下面是第一个框架<!DOCTYPE html><html> <head> <style type="text/css"> * {margin:0;padding:0;width:100%;height:100%;} img {width:100%;height:100%;} body {background-color:red;} </style> <title>banner</title> </head> <body scrolling="no" > <!--<img src="banner1.jpg"/>--> </body></html>下面是我想要变换的那个元素遮住上面框架<!DOCTYPE html><html> <head> <title>123</title> <style type="text/css"> * {margin:0;padding:0;width:100%;height:100%; position: relative;left: 0px; top: 0px;} img {width:100%;height:100%;} img:hover {width:200%;height:200%;transition: width 2s, height 2s,left 2s,top 2s; position: absolute; left: -50%; top: -50%;z-index:1;} body div {width:100%;background-color:blue;float:left;height:20%;} body div div {width:25%;height:100%;} #aa,#ab.#ac,#ad,#ba,#bb,#bc,#bd,#ca,#cb,#cc,#cd,#da,#db,#dc,#dd,#ea;#eb;#ec;#ed;{background-color:green;} </style> <script src="jquery-3.1.1.min.js"></script> <script> var idt=new Array("aa","ab","ac","ad","ba","bb","bc","bd","ca","cb","cc","cd","da","db","dc","dd","ea","eb","ec","ed");/*window.onload=function(){var FloorDivWidth=document.getElementsByTagName("div");alert(FloorDivWidth[0].offsetWidth);// test code;}*/ </script> </head> <body> <div id="a"> <div id="aa"><img src="lei.jpg" /></div> <div id="ab"><img src="lei.jpg" /></div> <div id="ac"><img src="lei.jpg" /></div> <div id="ad"><img src="lei.jpg" /></div> </div> <div id="b"> <div id="ba"><img src="lei.jpg" /></div> <div id="bb"><img src="lei.jpg" /></div> <div id="bc"><img src="lei.jpg" /></div> <div id="bd"><img src="lei.jpg" /></div> </div> <div id="c"> <div id="ca"><img src="lei.jpg" /></div> <div id="cb"><img src="lei.jpg" /></div> <div id="cc"><img src="lei.jpg" /></div> <div id="cd"><img src="lei.jpg" /></div> </div> <div id="d"> <div id="da"><img src="lei.jpg" /></div> <div id="db"><img src="lei.jpg" /></div> <div id="dc"><img src="lei.jpg" /></div> <div id="dd"><img src="lei.jpg" /></div> </div> <div id="e"> <div id="ea"><img src="lei.jpg" /></div> <div id="eb"><img src="lei.jpg" /></div> <div id="ec"><img src="lei.jpg" /></div> <div id="ed"><img src="lei.jpg" /></div> </div> </body></html>
就是第二张图片遮不住上面的红色框 z-index对于这种情况好像不起作用
我想让累变大的时候遮住红色,这个有什么解决办法呢??前提是frameset不能取消 展开
就是第二张图片遮不住上面的红色框 z-index对于这种情况好像不起作用
我想让累变大的时候遮住红色,这个有什么解决办法呢??前提是frameset不能取消 展开
1个回答
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询