jquery仿酷狗官网新闻焦点图

所属分类:媒体-幻灯片和轮播图

 30357  412  查看评论 (9)
分享到微信朋友圈
X
jquery仿酷狗官网新闻焦点图 ie兼容6

Html结构

<ul id=j_FocusNav class=ulFocus>
	<li rel="0">左侧标题,字数不大于18</li>
	<li rel="1">左侧标题,字数不大于18</li>
	<li rel="2">左侧标题,字数不大于18</li>
	<li rel="3">左侧标题,字数不大于18</li>
	<li rel="4">左侧标题,字数不大于18</li>
	<li rel="5">左侧标题,字数不大于18</li>
</ul>
<ul id=j_FocusCon class=ulFCon>
	<li>右侧图片1</li>
	<li><右侧图片2</li>
	<li>右侧图片3</li>
	<li>右侧图片4</li>
	<li>右侧图片5</li>
	<li>右侧图片6</li>
</ul>

加载方法:

<SCRIPT type=text/javascript>
$(document).ready(function(){
    $("#j_Focus").Focus();
});
</SCRIPT>

首页加载focus()方法。

设置时间:

var _timer = function(){
    (_timeInterval)&&(clearInterval(_timeInterval));
  _timeInterval = setInterval(_cutover,6000);
}

可以修改自动切换的时间,默认6秒

相关插件-幻灯片和轮播图

仿UC轮播插件imgSlider.js

js图片轮播幻灯片制作UC浏览器官网焦点图片切换,通过鼠标点击缩略图切换banner大图,带左右按钮控制缩略图片滚动切换,进行图片自动轮播
  幻灯片和轮播图
 31380  363

强大的js焦点图插件myFocus(完整版)

myFocus是一个专注于WEB端焦点图轮换图的JS库。该焦点图插件集成了30多种风格图片切换效果,体积小,使用简单,兼容ie6+和所有的主流浏览器。
  幻灯片和轮播图
 41172  453

eddielbt图片轮播

图片的轮播,左右两边的移动按钮可以调皮的波动
  幻灯片和轮播图
 42029  379

jQuery图片左右切换

图片左右切换,鼠标悬停,图片放大
  幻灯片和轮播图
 36725  347

讨论这个项目(9)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    a米 0
    2018/7/11 16:13:58
    jquery-2.0.3.min.js不行,用了jquery.min.js,另一个插件又不行,两个有冲突,怎么解决?
        西瓜1
        2018/7/11 16:22:02

        高版本jQuery需要扩展缓动选项包含jQueryUI,是调用的jQuery后面在加上jquery-ui-1.11.0.js即可解决问题

        <script src="jquery-2.1.1.js"></script> <!--当前jquery版本-->
        <script src="http://www.jq22.com/jquery/jquery-ui-1.11.0.js"></script>
    回复
    八月有雨 0
    2016/11/14 11:11:18
    孤光 0
    2016/11/1 16:11:12
    为啥里面的jquery.min.js换成jquery.1.11.3min.js就不能运行了。。。求解、、换其他版本也不行。。。求解。
        areyouOk0
        2016/11/1 18:11:16
        都引用上,不冲突。
    回复
    _全栈巍 0
    2016/9/11 11:09:27
    许你,不变的情意? 0
    2016/8/31 13:08:17
    I~No* 0
    2016/5/18 20:05:32
    YG。 0
    2016/5/3 17:05:34
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复