Tutorial on helping customers (www.bkjia.com)Yesterday, a friend asked a small Editor of the Helper house a question about CSS, which was not very difficult. He did not reply to his work because he was too busy yesterday. He came early this morning, I chatted with MM about the business and the time was up. I had to deal with my friend's Affairs yesterday, so that this kid could not say that I was a friend of mine. Haha, the problem with theme is: how to use CSS to slide the mouse to display the hidden layer effect? Let's look at the instance Code directly below:
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN "" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <Html xmlns =" http://www.w3.org/1999/xhtml "> <Head> <meta http-equiv =" Content-Type "content =" text/html; charset = gb2312 "/> <title> Use CSS to implement layer-based mouse sliding and hide the effect-helper's house-Focus on webmasters and the internet! </Title> <meta name = "description" content = "is a global provider of Chinese Internet information and tutorials. It has been committed to providing impetus for Internet development for many years, liehuo is passionate, positive, upward, and progressive. the character advocated by Net! "/> <Meta name =" keywords "content =" website construction, webmaster, website construction information, Chinese webmaster, website construction, website development, webpage and plane design, web standards, personal websites, SEO, website promotion, HTML, CSS, xhtml, css, Dreamweaver, Fireworks, Flash, Asp, Php, Jsp, ASP. NET, iis, Apache, Photoshop, Access, MySQL, SQL server, javaScript "/> <meta http-equiv =" X-UA-Compatible "content =" IE = 7 "> <meta content =" Copyright 2009 bkjia.com "name =" copyright "/> <body> <table width = "200" border = "0" cellspacing = "0" cellpadding = "0"> <tr> <td bgcolor = "#99 FFFF" onmouseover = "document. all. layer1.style. visibility = 'visable' "onmouseout =" document. all. layer1.style. visibility = 'den den '"> display </td> <td bgcolor =" # 0066FF "onmouseover =" document. all. layer1.style. visibility = 'den den '"> hide </td> </tr> </table> <input type =" button "name =" button "id =" button "value =" button "onclick =" document. all. layer1.style. visibility = 'visable' "/> <p> </p> <div id =" Layer1 "style =" visibility: hidden; width: 400px; height: 300px; background-color: #99 CCFF; x "> </body>
Tip: the code can be modified before running!
Well, I finally finished writing it. I wrote it by referring to a friend's example on the Internet. Let's take a look at it. If there is anything wrong, please feel free to give your comments. I will send it to my friends later.