<!DOCTYPE html> <html> <head lang="zh"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width" /> <meta charset="UTF-8"> <title>HTML5擦玻璃效果 - 何问起</title> <base target="_blank" /> </head> <body style="margin: 0; padding: 0;"> <!-- 图片需用本地图片 ,网络图片无效 --> <div id="box" style="width: 100%; min-height:480px;" data-image-src="img/hovertreecity.jpg"></div> </body> </html> <style> .clean-window-out { position: relative; padding: 0; } .clean-window-out .window-image, .clean-window-out .window-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .clean-window-out .window-canvas { z-index: 2; } a { color: white; } .hwqewm { width: 200px; height: 176px; position: fixed; z-index: 99999; bottom: 0px; left: 0px; right: 0px; margin: 0px auto; color: white; } </style> <script src="http://hovertree.com/texiao/html5/25/hovertreegrass.js"></script> <!-- Greate by HoverTree (Sun Mar 27 02:45:46 CST 2016) 43ms -->