摘要:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xml
<!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" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>js小案例By Johnson</title> <style type="text/css" media="screen"> div{margin:200px auto;width:200px;height:100px;background-color:#009688;border-radius:2px;color:#FFF;text-align:center;line-height:100px;} </style> <script type="text/javascript" charset="utf-8" > function bc(y){ y.style.backgroundColor="#FF5722"; y.style.width="1000px"; y.style.transition="5s"; y.style.borderRadius="10px"; } function lv(y){ y.style.width='200px'; y.style.height='100px'; y.style.backgroundColor='#009688'; y.style.borderRadius='2px'; } </script> </head> <body> <div onmouseover="bc(this)" onmouseleave="lv(this)"> <h1>变长,变长....</h1> </div> </body> </html>