jQuery焦点图切换特效代码分享


Posted in Javascript onSeptember 15, 2015

本文实例讲述了jQuery焦点图切换特效。分享给大家供大家参考。具体如下:
这是一款网易保健品商城网站的jQuery焦点图代码,界面简洁、时尚、大方,通用性比较强,实现过程很简单。
运行效果图:      -------------------查看效果 下载源码-------------------

jQuery焦点图切换特效代码分享

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
在head区域引入CSS样式:

<link rel="stylesheet" href="css/zzsc.css"/>

为大家分享的jQuery焦点图切换特效代码如下

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>jQuery焦点图</title>
<link rel="stylesheet" href="css/zzsc.css"/>
<script src="js/jquery-1.4.2.js"></script>
<script src="js/easyCore.js"></script>
</head>
<body>
<center>
 <div class="fright cleafix">
  <section id="picBox" class="sliderBox">
   <ul id="show_pic">
    <li><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hoqk6ne310002.jpg" width="710" height="280" border="0" /></a></li>
    <li class="hide"><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hmu2bby910001.jpg" width="710" height="280" border="0" /></a></li>
    <li class="hide"><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hne5kxga10001.jpg" width="710" height="280" border="0" /></a></li>
    <li class="hide"><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hlw1vdep10003.jpg" width="710" height="280" border="0" /></a></li>
    <li class="hide"><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hp92wuht10001.jpg" width="710" height="280" border="0" /></a></li>
    <li class="hide"><a target="_blank" href="https://3water.com/jiaoben/"><img src="images/hp0i5srm10022.jpg" width="710" height="280" border="0" /></a></li>
   </ul>
  </section>
<script src="js/index.js"></script>
</center>
<div style="text-align:center;clear:both">
</div>
</body>
</html>

以上就是为大家分享的jQuery图片轮播特效代码,希望大家可以喜欢,并应用到实践中。

Javascript 相关文章推荐
JavaScript 撑出页面文字换行
Jun 15 Javascript
jquery.lazyload  实现图片延迟加载jquery插件
Feb 06 Javascript
Jquery获取复选框被选中值的简单方法
Jul 04 Javascript
js 鼠标移动显示图片的简单实例
Dec 25 Javascript
jquery实现弹出层遮罩效果的简单实例
Mar 03 Javascript
超棒的响应式布局jQuery插件Freetile.js
Nov 17 Javascript
javascript中return,return true,return false三者的用法及区别
Nov 17 Javascript
使用jquery给指定的table动态添加一行、删除一行
Oct 13 Javascript
JS出现失效的情况总结
Jan 20 Javascript
简单实现JS上传图片预览功能
Apr 14 Javascript
利用d3.js力导布局绘制资源拓扑图实例教程
Jan 08 Javascript
nuxt 实现在其它js文件中使用store的方式
Nov 05 Javascript
jquery点击缩略图切换视频播放特效代码分享
Sep 15 #Javascript
JS+CSS实现带有碰撞缓冲效果的竖向导航条代码
Sep 15 #Javascript
基于jQuery倾斜打开侧边栏菜单特效代码
Sep 15 #Javascript
基于jQuery滑动杆实现购买日期选择效果
Sep 15 #Javascript
JavaScript 封装一个tab效果源码分享
Sep 15 #Javascript
jQuery简单实现两级下拉菜单效果代码
Sep 15 #Javascript
黑帽seo劫持程序,js劫持搜索引擎代码
Sep 15 #Javascript
You might like
把从SQL中取出的数据转化成XMl格式
2006/10/09 PHP
PHP中的加密功能
2006/10/09 PHP
利用PHP实现图片等比例放大和缩小的方法详解
2013/06/06 PHP
php实现文件下载功能的几个代码分享
2014/05/10 PHP
PHP读取大文件末尾N行的高效方法推荐
2016/06/03 PHP
关于PHP5.6+版本“No input file specified”问题的解决
2019/12/11 PHP
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
2010/06/18 Javascript
让你的CSS像Jquery一样做筛选的实现方法
2011/07/10 Javascript
JS高级笔记
2011/07/13 Javascript
一个简单的弹性返回顶部JS代码实现介绍
2013/06/09 Javascript
使用Nodejs开发微信公众号后台服务实例
2014/09/03 NodeJs
JavaScript生成随机数的4种自定义函数分享
2015/02/28 Javascript
JS简单去除数组中重复项的方法
2016/09/13 Javascript
详解使用Vue.Js结合Jquery Ajax加载数据的两种方式
2017/01/10 Javascript
JavaScript实现弹出广告功能
2017/03/30 Javascript
Angular 2.0+ 的数据绑定的实现示例
2017/08/09 Javascript
微信小程序swiper组件用法实例分析【附源码下载】
2017/12/07 Javascript
vue.js 微信支付前端代码分享
2018/02/10 Javascript
详解Howler.js Web音频播放终极解决方案
2020/08/23 Javascript
浅谈python类属性的访问、设置和删除方法
2016/07/25 Python
django1.8使用表单上传文件的实现方法
2016/11/04 Python
浅谈Python处理PDF的方法
2017/11/10 Python
Python面向对象class类属性及子类用法分析
2018/02/02 Python
python如何为被装饰的函数保留元数据
2018/03/21 Python
Sanic框架请求与响应实例分析
2018/07/16 Python
Python爬取知乎图片代码实现解析
2019/09/17 Python
Python函数参数类型及排序原理总结
2019/12/19 Python
使用python-pptx包批量修改ppt格式的实现
2020/02/14 Python
Django之choices选项和富文本编辑器的使用详解
2020/04/01 Python
利用css3制作3D样式按钮实现代码
2013/03/18 HTML / CSS
德国健康生活方式网上商店:Landkaufhaus Mayer
2019/03/12 全球购物
Servlet的实例是在生命周期什么时候创建的?配置servlet最重要的是什么?
2012/05/30 面试题
函授毕业生自我鉴定范文
2014/03/25 职场文书
2015元旦家电促销活动策划方案
2014/12/09 职场文书
简历自我评价范文
2019/04/24 职场文书
Python torch.flatten()函数案例详解
2021/08/30 Python