jQuery.KinSlideshow焦点图轮换

时间:2023-01-11 00:10:18

兼容IE6/IE7/IE8/IE9,FireFox,Chrome*,Opera的 jQuery. KinSlideshow幻灯片插件,功能很多 ,基本能满足你在网页上使用幻灯片(焦点图)效果。

演示网址:http://www.lanrentuku.com/down/js/jiaodiantu-794/index.html

jQuery.KinSlideshow焦点图轮换

KinSlideshow默认设置效果代码:

*焦点图显示的标题为 img 中 alt 属性中的文字

*当只有一张图片时不显示按钮,但也会有无缝切换效果

提示1:

外层div建议加上一句样式:style="visibility:hidden;"

不加此句在IE下页面刚加载的瞬间时候会看到所有图片原始样子

这是因为KinSlideshow 要等页面加载完成才能解析页面中要设置成焦点图的HTML

虽然只有不到0.01秒的瞬间但用户体验不太好,所以建议加上。不加对程序也没影响!

小提示2:

想要兼容Chrome需要在img标签中写上图片的实际宽度和高度<img src= width="xx" height="xx" alt="标题" >,其他浏览器不需要。<img src="" alt="标题" >

附件下载:Jquery.KinSlideshow.rar

jQuery.KinSlideshow焦点图轮换的更多相关文章

  1. jQuery cxSlide 焦点图轮换

    cxSlide 是一个简单易用的焦点图展示插件,支持水平.纵向切换,透明过渡切换. 已支持 CSS 动画过渡切换.通过 CSS 动画切换,可以展示更多效果. 版本: jQuery v1.7+ jQue ...

  2. 8款耀眼的jQuery&sol;HTML5焦点图滑块插件

    1.HTML5/CSS3超酷焦点图特效 带前后翻页按钮 今天要分享的这款HTML5/CSS3焦点图插件切换效果比较简单,但是外观和功能却十分强大.该CSS3焦点图在切换图片时,图片以淡入淡出的方式缩小 ...

  3. Jquery幻灯片焦点图插件

    兼容IE6/IE7/IE8/IE9,FireFox,Chrome*,Opera的 jQuery. KinSlideshow幻灯片插件,功能很多 ,基本能满足你在网页上使用幻灯片(焦点图)效果. 下载

  4. KinSlideshow焦点图轮播插件

    KinSlideshow默认设置效果代码: *焦点图显示的标题为 img 中 alt 属性中的文字 *当只有一张图片时不显示按钮,但也会有无缝切换效果 * jquery ..以上版本 jvascrip ...

  5. jQuery制作焦点图&lpar;轮播图&rpar;

    焦点图(轮播图) 案例 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:/ ...

  6. Jquery制作--焦点图淡出淡入

    之前写了一个焦点图左右轮播的,感觉淡出淡入用得也比较多,就干脆一起放上来啦.这个容器用了百分比宽度,图片始终保持居中处理,定宽或者自适应宽度都是可以的. 兼容到IE6+以上浏览器,有淡出淡入速度和切换 ...

  7. Jquery制作--焦点图左右轮播

    公司项目经常用到轮播焦点图,于是自己写了一个纯jq形式的横向轮播焦点图,可点击小圆点或者左右按钮进行切换,属于定宽类型.改成自适应宽度的也不难,将css里面的bannerCon宽度改为百分比,再在js ...

  8. 8种效果实例-jQuery anoSlide 焦点图轮播

    anoslide是一款可调节效果至任意宽度大小,支持图文混合内容显示的图片轮播插件. 在线实例 单个 多个 动画延迟 自动播放 显示分页 显示标题 延迟加载 自适应高度 使用方法 <div cl ...

  9. jQuery实现焦点图&lbrack;兼容ie7&plus;&rsqb;

    HTML: <div class="freehand" id="freehand"> <h1>宠物手绘</h1> <d ...

随机推荐

  1. 命令删除visualstudio&period;com云端项目&lpar;TFS&rpar;

    1.运行命令行 2.tfsdeleteproject /collection:https://域名.visualstudio.com/DefaultCollection “项目名称”

  2. DOM方法入门 - 第二课

    1.console.log()是吧元素显示在控制台2.appendChild() 就是将元素追加到末尾3.innerHTML获取的是元素里面的所有内容包括里面的子元素4.innerText获取的是元素 ...

  3. django User model

    django User model operation this tutorial will guide us to know how to manipulate django User model. ...

  4. 使用CORS方式跨域

    什么是CORS CORS(Cross-Origin Resource Sharing 跨源资源共享),当一个请求url的协议.域名.端口三者之间任意一与当前页面地址不同即为跨域. ===前端 不需要携 ...

  5. IDEA的十大快捷键

    Intellij IDEA中有很多快捷键让人爱不释手,*上也有一些有趣的讨论.每个人都有自己的最爱,想排出个理想的榜单还真是困难.以前也整理过Intellij的快捷键,这次就按 ...

  6. java三大特性--封装

    1.定义: 封装,顾名思义,就是密封包装起来.在面向对象程式设计方法中,封装(英语:Encapsulation)是指,一种将抽象性函式接口的实作细节部份包装.隐藏起来的方法. 封装可以被认为是一个保护 ...

  7. pprof函数名未翻译、为函数地址0x00000232382788

    这几天在分析一个性能未达预期的功能,使用gperftools cpu profiler生成后,使用pprof格式化的时候,发现pprof出的结果函数名未翻译.为函数地址,如下所示: 每个节点代表一个函 ...

  8. word怎么在方框中打对号

    最快最简单的方法,是在word里输入一个大写的R,然后选中并将字体改为wingdings2,至于那个带叉号的方框图形,可以输入大写字母T并将字体设置为windings2

  9. Android中隐藏标题栏和状态栏

    http://www.cnblogs.com/zhuguangwei/archive/2011/01/18/1938276.html 一.隐藏标题栏 //隐藏标题栏 this.requestWindo ...

  10. 企业&quot&semi;信息化建设&quot&semi;价值

    企业信息化现状分析 随 着企业信息化建设的快速发展,信息技术与信息系统对企业组织形态.治理结构.管理*.运作流程和商业模式的影响日益深化,企业组织对信息技术和信息 系统的依赖性在日益加强,IT正成为 ...