1、首先打开软件，并创建一个新的html文件。
2、创建新文件后，设置页面背景颜色。
3、在新文件中创建段落一，或者选择一个段落。
4、再引入图片并设置图片大小，这里就可以设置图片浮动至段落的左边。
5、创建段落二，或者选择一个新的段落。
6，再次引入图片并设置图片大小，同时设置图片浮动至段落的右边。
这是JS代码实现的，需要编写JS脚本，然后在head区域引入JS文件，然后在body区加入相应JS的引用。当然最快捷方便的方法就是百度去找个类似的源码就可以搞定了。漂浮源码很多的~ 一般是先HEAD引入JS文件，然后BODY或者其他地方加入JS调用代码 就可以实现了。
一般下载源码的地方会提示你怎么用。耐心找找
<!doctype html><html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<body>
<style>
ul,li{list-style:nonemargin:0padding:0}
li{width:287pxheight:287pxposition:relative}
li a{display:blockwidth:100%height:100% position:absolutetop:0left:0}
li a:hover{background:#f00}
.box{width:0height:287px position:absoluteleft:0top:0background:#f00 overflow:hidden}
li:hover .box{width:287pxheight:287px-webkit-transition:all .3s ease-in-moz-transition:all .3s ease-in-ms-transition:all .3s ease-in-o-transition:all .3s ease-intransition:all .3s ease-in}
</style>
<ul>
<li><img src="http://img0.bdstatic.com/img/image/shouye/lyj/huzi.jpg"><div class="box"><span>哈哈哈哈哈哈哈</span></div></li>
</body>
</html>
