经过前两部分的讲解,我们大概知道内容滑动切换的基本开发思路和技巧,现在我们在第三部分将前面两部分的代码进行优化,封装成一个jQuery插件:jquery.hwSlide.js。开发者可以轻松创建各种图片轮播效果、焦点图效果、图文混排滑动效果。
hwSlider具有以下特性:
多个参数定制,满足不同项目需求。 支持移动端触控滑动。 支持图文混排,支持各种html元素。 响应式自适应屏幕尺寸。 同一页面支持多个滑动切换。 轻量级的,压缩版不到4KB。 支持所有现代浏览器,支持ie8+。
HTML 首先在页面head部位载入hwSlider所需的基本css样式文件,以及jquery库文件和hwSlider插件,当然我建议把js文件放在页面底部加载。