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中“+=”的应用
Feb 02 Javascript
Javascript typeof 用法
Dec 28 Javascript
javascript document.compatMode兼容性
Feb 23 Javascript
javascript中的prototype属性使用说明(函数功能扩展)
Aug 16 Javascript
Javascript动画的实现原理浅析
Mar 02 Javascript
jQuery实现企业网站横幅焦点图切换功能实例
Apr 30 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
Dec 14 Javascript
深入了解JavaScript的逻辑运算符(与、或)
Dec 20 Javascript
改变vue请求过来的数据中的某一项值的方法(详解)
Mar 08 Javascript
详解vue-video-player使用心得(兼容m3u8)
Aug 23 Javascript
JS实现可视化音频效果的实例代码
Jan 16 Javascript
JS+DIV实现拖动效果
Feb 11 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
php smarty函数扩展
2010/03/15 PHP
PHP学习之输出字符串(echo,print,printf,print_r和var_dump)
2011/04/17 PHP
fleaphp rolesNameField bug解决方法
2011/04/23 PHP
基于magic_quotes_gpc与magic_quotes_runtime的区别与使用介绍
2013/04/22 PHP
利用yahoo汇率接口实现实时汇率转换示例 汇率转换器
2014/01/14 PHP
php计划任务之ignore_user_abort函数实现方法
2015/01/08 PHP
php获取flash尺寸详细数据的方法
2016/11/12 PHP
PHP获取当前日期及本周一是几月几号的方法
2017/03/28 PHP
PHP多进程编程实例详解
2017/07/19 PHP
JS中Iframe之间传值的方法
2013/03/11 Javascript
密码框显示提示文字jquery示例
2013/08/29 Javascript
js对图片base64编码字符串进行解码并输出图像示例
2014/03/17 Javascript
javascript判断复选框是否选中的方法
2015/10/16 Javascript
VC调用javascript的几种方法(推荐)
2016/08/09 Javascript
Bootstrap3下拉菜单的实现
2017/02/22 Javascript
Avalonjs双向数据绑定与监听的实例代码
2017/06/23 Javascript
Angular4开发解决跨域问题详解
2017/08/28 Javascript
在create-react-app中使用css modules的示例代码
2018/07/31 Javascript
layui的layedit富文本赋值方法
2019/09/18 Javascript
刷新页面后让控制台的js代码继续执行
2019/09/20 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
2020/07/20 Javascript
vue组件暴露和.js文件暴露接口操作
2020/08/11 Javascript
Python3处理文件中每个词的方法
2015/05/22 Python
Python输出9*9乘法表的方法
2015/05/25 Python
对Python正则匹配IP、Url、Mail的方法详解
2018/12/25 Python
手把手教你安装Windows版本的Tensorflow
2020/03/26 Python
Java软件工程师综合面试题笔试题
2013/09/08 面试题
企业授权委托书范本
2014/04/02 职场文书
作风建设年活动实施方案
2014/10/24 职场文书
2014年评职称工作总结
2014/11/20 职场文书
求职自我评价范文
2015/03/09 职场文书
医药公司开票员岗位职责
2015/04/15 职场文书
golang 如何用反射reflect操作结构体
2021/04/28 Golang
Python+Appium实现自动抢微信红包
2021/05/21 Python
eclipse创建项目没有dynamic web的解决方法
2021/06/24 Java/Android
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技