平时，在上网的时候经常看到有这样的特效。今日小编就带大家来制作这种效果
其实这种效果还是很容易制作的，首先，我们来分析一下原理，当鼠标点击左侧的li的时候，右侧的图片自动切换。
1：获取li下面img标签的大图片地址
var img=$(this).find("img").attr("data-img")
2：高亮显示当前的li,先要清除掉所有的高亮
$(".list li").removeClass("on")//移除所有的特效
$(this).addClass("on")//给当前li添加一个特有高亮效果
手动触发效果代码：
自动触发代码：
自动触发就是定时，让程序自动点击运行
1：获取li下面所有图片的个数
2：设置间隔的时间，毫秒
3：我们设置一个变量i，i的最大值等于图片个数，如果超过图片的个数，直接从0开始。
4：设置一个定时器，3秒自动执行操作
平时，在上网的时候经常看到有这样的特效。今日小编就带大家来制作这种效果 演示地址：http://362.tkv5....
焦点图轮播特效之原理、焦点图轮播样式之布局、焦点图轮播之箭头切换、焦点图轮播之无限滚动。 js简介、用法、输出。
特效插件网址 jQuery插件库-收集最全最新最好的jQuery插件 jquery特效,jquery插件库,jqu...
轮播图是前端很常用的一个网页特效,几乎所有的网站或多或少都会用到这个特效.轮播图的插件也有很多,用jQuery写起...
前端开发 jQuery之家:jQuery之家致力于搜集和整理各种jQuery插件，jQuery特效，jquery ...
jQuery CSS操作函数 常用jQuery CSS操作函数介绍： jQuery 常用特效API： jQuery...
TouchSlide 可用于javascript触屏滑动特效插件，移动端滑动特效，触屏焦点图，触屏Tab切换，触屏...
了解jQuery UI jQuery UI是以jQuery为基础的开源JavaScript集成页面特效库，是jQu...
企业网站 用 HTML+CSS+jQuery 做的一个企业网站前端页面。 使用的 jQuery 插件： 焦点图轮播...
1.1 jQuery动画特效说明 jQuery框架中为我们封装了众多的动画和特效方法，只需要调用对应的动画方法传递...
本文标题：jquery特效001焦点图
本文链接：https://www.haomeiwen.com/subject/lqyjlctx.html
网友评论