如何实现翻牌效果
1、我们先新建如图所示的文件目录结构,【images】存放图片;【js】存放java脚本;【index.html】网页文件

2、我们用专门的编程软件打开这个文件夹

3、引用js脚本文件<script type="text/javascript" src="js/jquery.min.js"></script>

4、js脚本文件,目的是鼠标放上去实现翻牌效果

5、样式文件我们可以写在head头部之间,也可以写在一个单独的样式文件中,然后引用

6、 <div id="brand"> <div class='title'> 热门品牌推荐 </div> <ul class='bd-box'> <li> <a href="#"> </a> <img src="images/1.jpg" /> <span>百度</span> </li> <li> <a href="#"> </a> <img src="images/2.jpg" /> <span>百度</span> </li> <li> <a href="#"> </a> <img src="images/3.jpg" /> <span>百度</span> </li> <li> <a href="#"> </a> <img src="images/4.jpg" /> <span>百度</span> </li> </ul> </div>

7、单击右键,在网页中浏览,可以看到鼠标放到相应图标上会旋转,实现了翻牌效果

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
阅读量:163
阅读量:190
阅读量:30
阅读量:104
阅读量:193